pourquoi ce code javascript saute-t-il dans le code jQuery? conflit appendChild?

Question

Je vais utiliser un certain jQuery en dessous de ce morceau de code (que je peux réécrire en jQuery). jQuery est chargé. Mais je ne comprends pas pourquoi, quand je traverse ce code dans le débogueur, le débogueur saute dans jQuery sur la ligne indiquée, et je reçois l'erreur que "UL.appendChild" n'est pas une fonction.

var Dialog = document.createElement('div').id='meta-dialog'; 
var Tabs = document.createElement('div').id = 'meta-tabs';   
var UL = document.createElement('ul').id = 'meta-ul'; 


var li1 =document.createElement('li'); li1.id = 'term1-LI'; 
var li2 =document.createElement('li'); li2.id = 'term2-LI'; 

var li1a = document.createElement('a'); 
var li2a = document.createElement('a'); 

li1a.href='#meta-tab1'; li1a.innerHTML = 'term1'; 
li2a.href='#meta-tab2'; li2a.innerHTML = 'term2'; 

li1.appendChild(li1a); 
li2.appendChild(li2a); 

UL.appendChild(li1) ; // Firebug debugger jumps into jQuery here 
UL.appendChild(li2); 

Le problème est-il apparent à tout le monde? Est-ce un conflit avec jQuery?

Answer 1

// Here UL will be the id attribute, not the <ul> element. 
var UL = document.createElement('ul').id = 'meta-ul'; 

// this doesn't makes sense... (id.appendChild) 
UL.appendChild(li1) ; 

// solution: 
var UL = document.createElement('ul'); 
UL.id = 'meta-ul'; 

Et il en va de même pour les boîtes de dialogue et les onglets. (votre li1 et li2 vont bien)

Oh, et tant que vous n'utilisez rien commençant par $, vous ne pouvez pas entrer en conflit avec jQuery.

Answer 2

>>> var UL = document.createElement('ul').id = 'meta-ul'; 
>>> UL 
"meta-ul" 

Answer 3

Votre UL n'est pas un objet élément jQuery, juste un élément JavaScript natif. Vous aurez besoin d'obtenir le UL avec $(UL) de jQuery afin d'utiliser les méthodes spécifiques de jQuery.