JS DOM Äquivalent für JQuery anhängen

Question

Was die Standard-DOM-Äquivalent für JQuery ist

element.append("<ul><li><a href='url'></li></ul>")?

Answer 1

Ich glaube, Sie die Innerhtml Eigenschaft zu erweitern haben diese

element[0].innerHTML += "<ul><li><a href='url'></a></li></ul>"; 

eine Erklärung zu tun:

• [0] benötigt, da element ist eine Sammlung
• + = verlängern die innerHTML und nicht überschreiben
• Schließen </a> benötigt, da nur einige Browser gültige html erlauben innerHTML- zu setzen

Answer 2

element.innerHTML += "<ul><li><a href='url'></li></ul>"; 

Answer 3

aus dem jQuery-Quellcode:

append: function() { 
    return this.domManip(arguments, true, function(elem) { 
     if (this.nodeType === 1) { 
      this.appendChild(elem); //<==== 
     } 
    }); 
}, 

Beachten Sie, dass es, um Sie aus der das DOM-Element konstruieren müssen, um sicherzustellen arbeiten string, es wird mit jQuery domManip Funktion durchgeführt.

jQuery 1.7.2 source code

Answer 4

Verwenden DOM-Manipulationen, nicht HTML:

var list = document.createElement('ul'); 
var item = document.createElement('li'); 
var link = document.createElement('a'); 

link.href = 'url'; 

item.appendChild(link); 
list.appendChild(item); 
element.appendChild(list); 

Answer 5

Der einfachste Weg, JQuery hängen Methode in reinem JavaScript zu replizieren ist mit "insertAdjacentHTML"

var this_div = document.getElementById('your_element_id'); 
    this_div.insertAdjacentHTML('beforeend','<b>Any Content</b>'); 

Mehr Info - MDN insertAdjacentHTML