2017-06-10 56 views
1
<!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> 

什麼即時做錯了?我想改變使用javascript的寬度或背景顏色div屬性,但它不工作。如何使用javascript操作div風格?

+6

'getElementByID'應該是'getElementById' –

+1

查看瀏覽器的JavaScript控制檯,即Google Chrome按CTRL-SHIFT-I並選擇控制檯選項卡總是一個好主意。在那裏你會看到類似「Uncaught TypeError:document.getElementByID不是函數」的錯誤消息,它指出瞭解決方案,正如Suresh已經提到的那樣。 – gus27

回答

3

變化getElementByIDgetElementById

<!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>

2

您使用getElementByID。正確的方法是getElementById

你的腳本應該是這個樣子:

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

我的歉意。更正它。 –

0

的JavaScript語法錯誤!這裏是更新...........

<!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>

+0

總是更好地解釋你已經改變了什麼,而不是期望人們將你的代碼與原始代碼進行比較以找到 - 在這種情況下 - 單個字符改變 – freefaller

0

變化的getElementById到的getElementById。

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

如果你想通過標籤名稱進行搜索,您可以直接使用的getElementsByTagName(「格」),而不是分配值DIV的ID。但請記住,它會返回所有div元素;即元素的集合。