Javascript ::按类触发firstChild元素

这段代码会自己说话并解释我想要实现的目标……

<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';
}
上一篇:如果我只知道python中的绑定方法,如何获取类的名称?


下一篇:tab页的使用方法