Wie man div Stil mit Javascript zu manipulieren?

<!DOCTYPE html> 
<html> 
    <head> 
     <title> 
     </title> 
     <style> 
     div 
     { 
      width:5em; 
      height:5em; 
      background-color:yellow; 
     } 
     </style> 
    </head> 
    <body> 
     <div id="div"> 
     </div> 
     <script> 
     window.onload = function() { 
     var x; 
     x = document.getElementByID("div"); 
     x.style.width = '9em' ; 
     x.style.backgroundColor = "green"; 
    }; 

     </script> 
    </body> 
</html>

Was mache ich falsch? Ich möchte div Eigenschaften wie Breite oder Hintergrundfarbe mit Javascript ändern, aber es funktioniert nicht.Wie man div Stil mit Javascript zu manipulieren?

Quelle

2017-06-10 matrix

'getElementByID' sollte 'getElementById' sein –

Es ist immer eine gute Idee, in der JavaScript-Konsole des Browsers zu suchen, d. H. Für Google Chrome drücken Sie STRG-UMSCHALT-I und wählen die Konsolenregisterkarte. Dort wird eine Fehlermeldung wie "Uncaught TypeError: document.getElementByID ist keine Funktion" angezeigt, die auf die Lösung verweist, wie Suresh bereits erwähnt hat. – gus27

Änderung getElementByID zu getElementById

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
     <title> 
 
     </title> 
 
     <style> 
 
     div 
 
     { 
 
      width:5em; 
 
      height:5em; 
 
      background-color:yellow; 
 
     } 
 
     </style> 
 
    </head> 
 
    <body> 
 
     <div id="div"> 
 
     </div> 
 
     <script> 
 
     window.onload = function() { 
 
     var x; 
 
     x = document.getElementById("div"); 
 
     x.style.width = '9em' ; 
 
     x.style.backgroundColor = "green"; 
 
    }; 
 

 
     </script> 
 
    </body> 
 
</html>

Quelle

2017-06-10 16:37:19

Sie verwenden getElementByID. Die korrekte Methode ist getElementById.

Ihr Skript sollte wie folgt aussehen:

window.onload = function() { 
    var x; 
    x = document.getElementById("div"); 
    x.style.width = '9em'; 
    x.style.backgroundColor = "green"; 
};

Quelle

2017-06-10 16:37:58

Entschuldigung. Korrigiert es. –

JavaScript Syntax Error! Hier ist das Update ...........

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <title> 
 
    </title> 
 
    <style> 
 
    /* div { 
 
     width: 5em; 
 
     height: 5em; 
 
     background-color: yellow; 
 
    } */ 
 
    </style> 
 
</head> 
 

 
<body> 
 
    <div id="div"> 
 
    </div> 
 
    <script> 
 
    
 
     var x = document.getElementById("div"); 
 
     x.style.width = "9em"; 
 
     x.style.height = "9em"; 
 
     x.style.display = "block"; 
 
     x.style.backgroundColor = "green"; 
 

 
    </script> 
 
</body> 
 

 
</html>

Quelle

2017-06-10 16:44:01 Momin

Immer besser zu erklären, was Sie geändert haben, anstatt zu erwarten, dass die Leute Ihren Code mit dem Original vergleichen, um in diesem Fall einen einzelnen Zeichenwechsel zu finden – freefaller

ändern getElementByID zu getElementById.

window.onload = function() { 
    var x; 
    x = document.getElementById("div"); 
    x.style.width = '9em'; 
    x.style.backgroundColor = "green"; 
};

Wenn Sie von der Tag-Namen suchen möchten, können Sie direkt verwenden getElementsByTagName („div“), anstatt eine ID des Wertes div zuzuweisen. Aber denke daran, dass es alle div Elemente zurückgeben wird; eine Sammlung von Elementen.

Quelle

2017-06-10 16:46:10 orabis

Wie man div Stil mit Javascript zu manipulieren?

Antwort

Verwandte Themen