Yocker
  1. Yocker
  3. Ottieni la rappresentazione di stringa di un nodo DOM
Intereting Posts
Perché Spring MVC richiede almeno due contesti? Graphviz: come passare da .dot a un grafico? mgo: le prestazioni delle query sembrano costantemente lente (500-650ms) socket.io rooms o namespacing? Ottenere il checksum MD5 di un file in Java Modelli paralleli completamente riproducibili che utilizzano il caret Come rimuovere gli spazi bianchi iniziali e finali in un campo MySQL? Reindirizzamento con Runtime.getRuntime (). Exec () non funziona Rappresentazione in serie di un Enum Timer in UpdatePanel Dove trovare le implementazioni delle funzioni stdio.h? Tabella JavaFX: come aggiungere componenti? Combinatoric ‘N scegli R’ in java math? Come impostare iframe src in Angular 2 senza causare l’eccezione `value non sicuro? Numero tondo fino al multiplo più vicino di 3

Ottieni la rappresentazione di stringa di un nodo DOM

Javascript: ho la rappresentazione DOM di un nodo (elemento o documento) e sto cercando la sua rappresentazione in stringa. Per esempio, 

var el = document.createElement("p"); el.appendChild(document.createTextNode("Test"));

dovrebbe produrre: 

 get_string(el) == "
Test
";

Ho la sensazione forte, che mi manca qualcosa di banalmente semplice, ma semplicemente non trovo un metodo che funzioni in IE, FF, Safari e Opera. Pertanto, outerHTML non è un’opzione.

È ansible creare un nodo genitore temporaneo e ottenere il contenuto HTML interno di esso: 

 var el = document.createElement("p"); el.appendChild(document.createTextNode("Test")); var tmp = document.createElement("div"); tmp.appendChild(el); console.log(tmp.innerHTML); // 
Test

EDIT: Si prega di consultare la risposta di seguito su outerHTML. el.outerHTML dovrebbe essere tutto ciò che è necessario.

Quello che stai cercando è ‘outerHTML’, ma ho bisogno di un fallback coz non compatibile con i vecchi browser. 

 var getString = (function() { var DIV = document.createElement("div"); if ('outerHTML' in DIV) return function(node) { return node.outerHTML; }; return function(node) { var div = DIV.cloneNode(); div.appendChild(node.cloneNode(true)); return div.innerHTML; }; })(); // getString(el) == "
Test
"

Qui troverai il mio plugin jQuery: ottieni l’HTML esterno dell’elemento selezionato

Sotto FF è ansible utilizzare l’object XMLSerializer per serializzare XML in una stringa. IE ti dà una proprietà xml di un nodo. Quindi puoi fare quanto segue: 

 function xml2string(node) { if (typeof(XMLSerializer) !== 'undefined') { var serializer = new XMLSerializer(); return serializer.serializeToString(node); } else if (node.xml) { return node.xml; } }

Non penso che tu abbia bisogno di uno script complicato per questo. Basta usare 

 get_string=(el)=>el.outerHTML;

Usa l’elemento # outerHTML: 

 var el = document.createElement("p"); el.appendChild(document.createTextNode("Test")); console.log(el.outerHTML);

Può anche essere usato per scrivere elementi DOM. Dalla documentazione di Mozilla:

L’attributo outerHTML dell’interfaccia DOM dell’elemento ottiene il frammento HTML serializzato che descrive l’elemento inclusi i suoi discendenti. Può essere impostato per sostituire l’elemento con i nodes analizzati dalla stringa specificata.

https://developer.mozilla.org/en-US/docs/Web/API/Element/outerHTML

Utilizza element.outerHTML per ottenere la rappresentazione completa dell’elemento, inclusi tag e attributi esterni.

Se il tuo elemento ha un genitore 

 element.parentElement.innerHTML

Ho sprecato un sacco di tempo a capire cosa c’è che non va quando eseguo un’iterazione di DOMElements con il codice nella risposta accettata. Questo è ciò che ha funzionato per me, altrimenti ogni secondo elemento scompare dal documento: 

 _getGpxString: function(node) { clone = node.cloneNode(true); var tmp = document.createElement("div"); tmp.appendChild(clone); return tmp.innerHTML; },

se si usa reactjs: 

 const html = ReactDOM.findDOMNode(document.getElementsByTagName('html')[0]).outerHTML;