title: Dart - `querySelector` cannot find element
body: <p>I wanted to use Dart to replace JavaScript.</p>
  <p>But it's not an advanced project. It's just a matter of dynamically changing a few elements within a single page.</p>
  <p>For starters, I wrote the following HTML code and Dart code to find the element based on its ID and display the text in the console.</p>
  <pre class="lang-html prettyprint-override"><code>&lt;!-- index.html --&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;title&gt;Test&lt;/title&gt;
          &lt;script type=&quot;text/javascript&quot; src=&quot;index.js&quot;&gt;&lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;p id=&quot;first-paragraph&quot;&gt;Target.&lt;/p&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  <pre class="lang-dart prettyprint-override"><code>// index.dart
  import 'dart:html';
  
  void main() {
    print(querySelector('#first-paragraph')?.innerText);
  }
  </code></pre>
  <p>The following command converts the file to a JavaScript file.</p>
  <pre><code>dart compile js index.dart -o index.js -O0
  </code></pre>
  <p>However, when I open the HTML file, the console shows <code>null</code>.</p>
  <p>The first code in Dart Pad HTML mode, which is very similar to the above code, appears to work (on Dart Pad).</p>
  <p>Why can't my code find the element?</p>
  <p>Thanks.</p>