Question

我不明白，邊框只在第一項上顯示，爲什麼？

HTML

<div id="theContainer"> 
    <div id="item">Content 1</div> 
    <div id="item">Content 2</div> 
</div>​ 

的JavaScript

document.getElementById('item').style.borderTop = '1px solid #0ea2c7';​ 

的jsfiddle：here

Answer 1

您可以使用document.getElementsByClassName

的JavaScript

var elements = document.getElementsByClassName('item'); 
for (i =0; i < ele.length; i++) { 
    elements[i].style.borderTop = '1px solid #000'; 
} 

HTML

<div id="theContainer"> 
    <div class="item">Content 1</div> 
    <div class="item">Content 2</div> 
</div>​ 

CSS

#theContainer { 
    height: 100px; 
    width: 500px; 
    position: relative; 
    border: 1px solid #900; 
    padding: 10px; 
} 
.item { 
    height: 50px; 
    width: 100%; 
} 
​ 

Answer 2

「的document.getElementById」 裝置「，則返回到的Elemen一個參考t通過它的ID「，見here;和id意味着身份，你應該在你的dom樹中每個id只有一個元素。

如果您想要設置多個元素的樣式，請嘗試使用class。

HTML

<div id="theContainer"> 
    <div class="item">Content 1</div> 
    <div class="item">Content 2</div> 
</div> 

CSS

.item { border-top: 1px solid #0ea2c7; }