这段代码会自己说话并解释我想要实现的目标……
<style>
.red{background:red}
.blue{background:blue}
</style>
<div id=test>
<button>1</button>
<button>2</button>
</div>
<script>
var firstBtn=document.getElementById("test").firstChild.className;
(firstBtn!="red")?firstBtn="red":firstBtn="blue";
</script>
这是jsFiddle:
http://jsfiddle.net/hnfeje2q/
非常简单,但因为我是JavaScript新手……
谢谢!
解决方法:
您可以先使用id = test获取div包装器,然后使用下面的代码加载该包装器中的第一个子元素,然后将“red”类添加到该元素/按钮中.
var wrapper = document.getElementById("test");
var firstButton = wrapper.childNodes[1];
// if the button doesn't have a red class, set it
if(firstButton.className.indexOf('red') == -1) {
firstButton.className = firstButton.className + ' red';
}
或者使用查询选择器
var firstButton = document.querySelector('#test button:first-child');
if(firstButton && firstButton.className.indexOf('red') == -1) {
firstButton.className = firstButton.className + ' red';
}