Quería usar Dart para reemplazar JavaScript.
Pero no es un proyecto avanzado. Es solo una cuestión de cambiar dinámicamente algunos elementos dentro de una sola página.
Para empezar, escribí el siguiente código HTML y código Dart para encontrar el elemento en función de su ID y mostrar el texto en la consola.
<!-- index.html --> <html> <head> <title>Test</title> <script type="text/javascript" src="index.js"></script> </head> <body> <p id="first-paragraph">Target.</p> </body> </html> // index.dart import 'dart:html'; void main() { print(querySelector('#first-paragraph')?.innerText); }El siguiente comando convierte el archivo en un archivo JavaScript.
dart compile js index.dart -o index.js -O0 Sin embargo, cuando abro el archivo HTML, la consola muestra null .
El primer código en el modo HTML de Dart Pad, que es muy similar al código anterior, parece funcionar (en Dart Pad).
¿Por qué mi código no puede encontrar el elemento?
Gracias.
Gracias por tus comentarios. Recordé sus comentarios y pude hacer que funcionara como se esperaba colocando la lectura del script al final del elemento del body o usando window.addEventListener . Me da vergüenza decir que me olvidé de hacer algo tan simple.
<!-- index.html --> <html> <head> <title>Test</title> </head> <body> <p id="first-paragraph">Target.</p> <script type="text/javascript" src="index.js"></script> </body> </html>o
// index.dart import 'dart:html'; void main() { window.addEventListener('DOMContentLoaded', (event) => { print(querySelector('#first-paragraph')?.innerText) }); }