Cargo div con PHP y luego quiero obtenerlo de HTML usando Javascript. Obtención de elementos por alertas de identificación undefined .
<html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> </head> <?php echo "<div id='myDiv'>Hello</div>" ?> <script> $( document ).ready(function() { alert( $("#myDiv").html()) }); </script> </html>¿Cómo es eso posible?
Ha guardado el archivo con una extensión .htm . Cámbielo a .php y el código funciona como se esperaba.
con html
<?php echo "<div id='myDiv'>Hello</div>" ?>
se interpreta como:
<?php echo "<div id='myDiv'> Hello </div> " ?>con las líneas 1 y 3 vistas como etiquetas, y las otras dos como salida.
El siguiente código existe dentro de "c:\xampp\htdocs\snippets\nov21\something.php" y cuando se solicita como localhost/snippets/nov21/something.php (el directorio raíz web es c:\xampp\htdocs\ ), realiza la acción que has mencionado.
<!doctype html> <html> <head> <script> window.addEventListener('load', onLoaded, false); function onLoaded(evt) { alert( document.querySelector('#myDiv').innerHTML ); } </script> </head> <body> <?php echo("<div id='myDiv'>Hello</div>"); ?> </body> </html>Ver la fuente de la página en el navegador devuelve lo siguiente:
<!doctype html> <html> <head> <script> window.addEventListener('load', onLoaded, false); function onLoaded(evt) { alert( document.querySelector('#myDiv').innerHTML ); } </script> </head> <body> <div id='myDiv'>Hello</div></body> </html>PHP es un lenguaje del lado del servidor, se representa del lado del servidor. Esto significa que no se procesará si solo abre un archivo .php con un navegador web y no funcionará si intenta ejecutar el código en un editor en línea. Debe estar alojado en un servidor web y luego el servidor lo procesa cuando se solicita.
¿Cómo es eso posible? Debido a que php nunca se procesa, por lo tanto, <div> no existe.
Dicho esto, algunas otras notas:
) php va en la sección <body></body> de tu html
) puede poner los <script> s en la parte inferior de la sección del cuerpo y no necesita usar $(document).ready() , ya que si está en la parte inferior del <body> , el documento está listo...
Esto no funcionará en un editor en línea, pero su código debería verse así:
<!doctype html> <head></head> <body> <?php echo "<div id='myDiv'>Hello</div>"; ?> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script> alert($("#myDiv").html()); </script> </body> </html>