2017-09-09 2 views
0

Der folgende Code soll mir erlauben, die Attribute des Elements p zu bearbeiten. Das Problem ist, dass es gleich bleibt. Ich habe einen Test hinzugefügt, um den Inhalt am Ende zu ändern, tut aber auch nichts. Die Textfelder, das Element zu bearbeiten erscheint und protokolliert die neuen Attribute aber das Element nicht ändertBearbeitung eines Elements Attribute funktioniert nicht

<body><p id=test>test</p> 
<script> 
var obj=document.getElementById("test") 
var display=""; 
for(var i in obj){ 
    display+="<label for="+i+">"+i+"</label><input id="+i+" value='"+obj[i]+"' oninput='obj["+i+"]=this.value; 
    console.log(obj["+i+"])'></input>" 
} 
document.body.innerHTML+=display 
obj.innerHTML="hello" 
</script> 
</body> 
+0

Erste offensichtliche Probleme: brauche Zitate in '

' und sollte jede JavaScript-Zeile mit einem Semikolon (;) – Nick

+0

beenden Zunächst zu beheben ist die Tatsache, dass Sie eine 'console.log()' Funktionsaufruf in Ihrer Zeichenfolge enthalten und es bricht die Syntax. Der Code funktioniert nach nur diesem Fix - [FIDDLE DEMO HIER] (https://jsfiddle.net/hdy9jqv7/1/) –

+0

Die Zitate sind nicht erforderlich, solange es keine Leerzeichen und abgesehen von ein paar seltenen Ausnahmen wie für Schleifen-Semikolons sind optional – user7951676

Antwort

0

Es ist nicht klar, was Sie zu tun versuchen, bitte angeben, was das gewünschte Ergebnis ist.

Dieser Code wirkt sich auf DOM aus, aber ich bin mir nicht sicher, ob Ihr Ergebnis so aussehen soll.

var obj = document.getElementById("test"); 
var display = ""; 
for (var i in obj) { 
    display += "<label for='" + i + "'>" + i + "</label><input id='" + i + "' value='" + obj[i] + "' oninput='document.getElementById(\"test\")[\"" + i + "\"]=this.value;console.log(document.getElementById(\"test\")[\"" + i + "\"])'></input>"; 
} 
document.body.innerHTML += display; 
obj.innerHTML = "hello"; 

ich im Grunde fixiert die Angabe in dem Code:

<body><p id=test>test</p> 
 
    <script> 
 

 
     var obj=document.getElementById("test").innerHTML 
 
     var display=""; 
 

 
     for(var i in obj){ 
 
      display+="<label for=" + i + ">" + i +"</label><input id=" + i + " value='"+obj[i]+"' oninput='obj[" + i + "]=this.value;console.log(obj["+i+"])'></input>" 
 
     } 
 

 
     document.body.innerHTML+=display 
 
     obj.innerHTML="hello" 
 

 
    </script> 
 
    </body>

1

Dieser modifizierte Code sollten Sie das <p> Elementattribute lassen ändern. Auch obj verlor aus irgendeinem Grund seine Referenz auf das eigentliche html-Element, stattdessen verwendete man document.getElement ....

+0

Ich habe beide versucht und obwohl die Konsole die Änderungen bestätigt, ist die Anzeige statisch – user7951676

+0

Haben Sie den aktualisierten Code verwendet? Das Element scheint sich damit für mich dynamisch zu aktualisieren. –

+0

Ja, ich habe diesen Code in der Antwort verwendet als SetAttribute – user7951676

Verwandte Themen