Javascript只影响一个元素

本文介绍了Javascript只影响一个元素的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我不明白，边框仅在第一项上可见，为什么？

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：

JsFiddle: here

推荐答案

您可以使用 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%;
}

这篇关于Javascript只影响一个元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

html

Javascript只影响一个元素

问题描述

推荐答案