javascript - obtener - innerhtml value
¿Por qué IE da errores inesperados al configurar innerHTML (10)
Intenté establecer innerHTML en un elemento de Firefox y funcionó bien, lo intenté en IE y obtuve errores inesperados sin una razón obvia.
Por ejemplo, si intentas configurar el innerHTML de una tabla como "hi from stu", fallará, porque la tabla debe ir seguida de una secuencia.
Acabo de descubrir que si intentas configurar innerHTML en un elemento en IE que no es lógicamente correcto, lanzará este error. Por ejemplo, si intentas configurar el innerHTML de una tabla como " hi from stu ", fallará, porque la tabla debe ir seguida de una secuencia. Aparentemente, Firefox no es tan quisquilloso. Espero eso ayude.
"Al parecer, Firefox no es tan selectivo" ==> Aparentemente FireFox tiene tantas fallas, que no registra esta violación obvia de las reglas básicas de html-nesting ...
Como alguien señaló en otro foro, FireFox aceptará, que anexará un documento html entero como hijo de un campo de formulario o incluso una imagen, - (
¿Has intentado configurar innerText y / o textContent? Algunos nodos (como las etiquetas SCRIPT) no se comportarán como se espera cuando intentes cambiar su innerHTML en IE. Más aquí sobre innerText versus textContent:
http://blog.coderlab.us/2006/04/18/the-textcontent-and-innertext-properties/
No sé por qué estás siendo modificado para la pregunta Stu, ya que esto es algo que resolví hace poco. El truco consiste en "inyectar" el código HTML en un elemento DOM que no está actualmente adjunto al árbol de documentos . Aquí está el fragmento de código que lo hace:
// removing the scripts to avoid any ''Permission Denied'' errors in IE
var cleaned = html.replace(/<script(.|/s)*?//script>/g, "");
// IE is stricter on malformed HTML injecting direct into DOM. By injecting into
// an element that''s not yet part of DOM it''s more lenient and will clean it up.
if (jQuery.browser.msie)
{
var tempElement = document.createElement("DIV");
tempElement.innerHTML = cleaned;
cleaned = tempElement.innerHTML;
tempElement = null;
}
// now ''cleaned'' is ready to use...
Tenga en cuenta que estamos utilizando solo el uso de jQuery en este fragmento aquí para probar si el navegador es IE, no hay una dependencia fuerte en jQuery.
¿Estás configurando un innerHTML completamente diferente o reemplazando un patrón en el innerHTML? Pregunto porque si estás tratando de hacer una búsqueda / reemplazo trivial a través del ''poder'' de innerHTML, encontrarás algunos tipos de elementos que no se reproducen en IE.
Esto se puede remediar con precaución al rodear su intento en un try / catch y burbujear el DOM a través de parentNode hasta que logre lograrlo.
Pero esto no será adecuado si está insertando contenido completamente nuevo.
Está viendo ese comportamiento porque innerHTML es de solo lectura para elementos de tabla en IE. Desde la documentación de la propiedad innerHTML de MSDN:
La propiedad es de lectura / escritura para todos los objetos, excepto el siguiente, para el cual es de solo lectura: COL, COLGROUP, FRAMESET, HEAD, HTML, STYLE, TABLE, TBODY, TFOOT, THEAD, TITLE, TR.
compruebe el alcance del elemento que está tratando de configurar el innerHTML. ya que FF e IE manejan esto de una manera diferente
He estado luchando con el problema de reemplazar una lista de enlaces en una tabla con una lista diferente de enlaces. Como se mencionó anteriormente, el problema viene con IE y su propiedad de solo lectura de los elementos de la tabla.
Agregar para mí no era una opción, así que (finalmente) resolvió esto (que funciona para Ch, FF e IE 8.0 (aún para probar otros, pero tengo la esperanza)).
replaceInReadOnly(document.getElementById("links"), "<a href>........etc</a>");
function replaceInReadOnly(element, content){
var newNode = document.createElement();
newNode.innerHTML = content;
var oldNode = element.firstChild;
var output = element.replaceChild(newNode, oldNode);
}
Funciona para mí, espero que funcione para ti
Puedes modificar el comportamiento. Aquí hay algunos códigos que previenen la recolección de basura de elementos referenciados en IE:
if (/(msie|trident)/i.test(navigator.userAgent)) {
var innerhtml_get = Object.getOwnPropertyDescriptor(HTMLElement.prototype, "innerHTML").get
var innerhtml_set = Object.getOwnPropertyDescriptor(HTMLElement.prototype, "innerHTML").set
Object.defineProperty(HTMLElement.prototype, "innerHTML", {
get: function () {return innerhtml_get.call (this)},
set: function(new_html) {
var childNodes = this.childNodes
for (var curlen = childNodes.length, i = curlen; i > 0; i--) {
this.removeChild (childNodes[0])
}
innerhtml_set.call (this, new_html)
}
})
}
var mydiv = document.createElement (''div'')
mydiv.innerHTML = "test"
document.body.appendChild (mydiv)
document.body.innerHTML = ""
console.log (mydiv.innerHTML)