Key des Objektes erfolgt nicht -

Question

Ich habe eine Funktion, die das Element erstellt und festgelegt Attribute nach Argumenten

function createInfo(x , obj , text){ 
    var element = document.createElement(x); 
    if(obj){ 
     var obj_child = Object.keys(obj); 
     for(var i = 0; i < obj_child.length; i++){ 
      element.setAttribute(obj_child[i], obj[obj_child[i]]); 
     } 
    } 
    if(text) 
     element.innerHTML = text; 
    return element; 
} 

es funktioniert gut, aber Problem ist, wenn ich „data-Attribut“ als Argument übergeben, zB

var div =createInfo("div",{class:"left_info",data-index:index},null) 

wirft

unerwartetes Token -

warum nicht wahr - im Namen des Schlüssels zu nehmen? Was stimmt damit nicht?

Answer 1

data-index sieht wie "data minus index" zum JavaScript-Parser aus und ergibt keinen Sinn dazu. Wenn Sie es als Eigenschaftsnamen verwenden möchten, setzen Sie es in Anführungszeichen, die sind, wie Sie JavaScript sagen, dass es nur ein Eigenschaftsname:

var div =createInfo("div",{class:"left_info","data-index":index},null) 
// ------------------------------------------^----------^ 

Einige ältere Browser können Sie benötigen class in Anführungszeichen zu setzen, als auch, aus einem ganz anderen Grund: class ist ein Schlüsselwort. (Aber modernere sind in Ordnung mit ihm nicht in Anführungszeichen zu sein, die JavaScript-Standard im Jahr 2009 aktualisiert wurde, zu verstehen, dass es nicht ein Schlüsselwort gibt.)

var div =createInfo("div",{"class":"left_info","data-index":index},null) 

Answer 2

Versuchen Sie das Objekt wie folgt definieren:

var div =createInfo("div",{"class":"left_info","data-index":index},null)