Hoja de estilos ignorada cuando se usa onload y document.write

Estoy jugando con JavaScript experimentando para tener una idea y ya he encontrado un problema. Aquí está mi código html:Hoja de estilos ignorada cuando se usa onload y document.write

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
<title>Insert title here</title> 
<link rel="stylesheet" type="text/css" href="styles.css"> 
<script type="text/javascript" src="testing.js"></script> 
</head> 
<body onload="writeLine()"> 
</body> 
</html>

aquí es los testing.js de JavaScript:

function writeLine() 
{ 
    document.write("Hello World!") 
}

aquí es la styles.css hoja de estilos:

html, body { 
    background-color: red; 
}

Así, un ejemplo muy sencillo, pero puedo haber elegido un ejemplo incómodo, usando a carga en una etiqueta corporal. Por lo tanto, el código anterior carga y ejecuta la función, pero la hoja de estilos no hace nada, a menos que elimine las etiquetas de script en el encabezado. He intentado poner las etiquetas de script en todos lados, pero nada funciona. Investigué en línea cómo vincular correctamente los archivos de JavaScript y no encontré una solución clara, ¿alguien puede señalar mi error?

he utilizado JavaScript antes, pero quiero un entendimiento claro desde el principio antes de usarlo por más tiempo

Fuente

2012-05-28 deucalion0

[esta publicación] (http://stackoverflow.com/q/10661964/575527) podría explicar más – Joseph

Demostración: http://jsfiddle.net/C6jKG/ –

Debería evitar el uso de 'document.write() ' – lanzz

Tu problema es con el document.write() llamado en un momento incorrecto ^*. Este método imprime el texto dado en el lugar actual de la página como estaba previsto que funcione mientras la página aún se carga. Debido a que está llamando cuando se cargó toda la página, los resultados son inesperados

su lugar debe manipular el árbol dom directamente (no definido?):

function writeLine() { 
    var text = document.createTextNode("Hello World!"); 
    document.body.appendChild(text); 
}

realidad en el navegador Opera veo fondo rojo para unos pocos milisegundos y luego vuelve a blanco. Intente comentar document.write() - el fondo es el esperado. Además, debe incluir la etiqueta <script> al final de body, pero esto no resolverá su problema.

^{* para ser honesto, no hay un buen momento para llamar document.write(), evitar que}

Fuente

2012-05-28 13:41:46

Considero que 'document.write' y' document.writeLn' son artefactos que deberían considerarse obsoletos en la práctica. No lo he usado en literalmente años. –

Así que en realidad me causé problemas en mi primer día de aprendizaje de JavaScript por document.write, pero estoy contento de haberlo hecho ya que estoy descubriendo muchas cosas interesantes aquí. ¡Gracias por la información! – deucalion0

Seleccioné tu publicación como la respuesta ya que proporcionaste un poco más de información. Intentaré evitar document.write como estándar. ¡Aclamaciones! – deucalion0

No puede utilizar document.write después de que el documento está cerrado (que será cuando onload incendios) sin destruir la documento existente (incluidos enlaces a hojas de estilo).

En su lugar, utilice DOM manipulación, que está cubierto por los capítulos 8 y 9 de la W3C JavaScript Core Skills.

Fuente

2012-05-28 13:40:24 Quentin

Lo que explica por qué la hoja de estilos no parece funcionar; ha sido eliminado/reemplazado y luego es un '' vacío. –

Muchas gracias por señalar POR QUÉ no estaba funcionando, ¡estaba desconcertado! ¡Ahora estoy buscando la manipulación del DOM! ¡Gracias! – deucalion0

En el ejemplo particular no importa donde se agrega la etiqueta script que el comando se ejecuta después de document.write el contenido es renderizado, sobrescribiendo el contenido existente.

Si agrega una alerta antes de sobrescribir el contenido, puede ver que su página es roja antes de que se sobrescriba con Hello World.

Fuente

2012-05-28 13:42:02 Nope

¡Gracias por el consejo, ahora he descubierto mis problemas! ¡Gracias! – deucalion0

Hoja de estilos ignorada cuando se usa onload y document.write

Respuesta

Cuestiones relacionadas