javascript 中 怎样用document.getElementsByClassName 选择全部的类

Question

var font= document.getElementsByClassName("font");
font.style.color = "blue";
我想要class属性为font的字体全部变成蓝色

Answer 1

var font=document.getElementsByClassName("font")

你用这个获取到的font 是一个数组，想要全部改变要用一个循环
for(var i=0;i<font.length;i++){
font[i].style.color='blue';
}
这样就行了,不过IE不支持，还是用jQuery吧

Answer 2

document.getElementsByClassName所得到的就是选择全部的类。
例子：如给所有class文本赋值
html部分：
<div class="class">文本1</div>
<div class="class">文本2</div>
js部分：
var all = document.getElementsByClassName("class");
for(var i=0;i<all.length;i++) {
all[i].innerHTML = "Hello World!";
}
结果：
<div class="class">Hello World!</div>
<div class="class">Hello World!</div>
总结：这样就可以达到处理全部类了。

Answer 3

原生的js里没有 getElementsByClassName这种写法吧？
建议楼主可以这样，先获取当前页面的元素，（或者某一类标签也可如： getElementsByTagName("input") .className;//取到所有input表单的css类名称）然后遍历这些元素，获得他们是否有ClassName 如果有且ClassName = font，再改变其样式即可！

Answer 4

document.getElementById（）就是根据id来获取元素的，不能直接用来获取元素的id

可以用getElementsByTagName（），下面是代码：
//代码开始

<select id="selectID">
</select>
<select id="selectID1">
</select>
<script type="text/javascript">
for(i=0;;i++){
var a=document.getElementsByTagName("select")[i];
if(a===undefined) {document.write("
结束");break;}
else{document.write("<br/>");document.write("第"+i+"个select的id是");document.write(a.id);}
}
</script>
//代码结束

上面的代码会列出页面中所有select的id，获取option的value值就容易了。

本回答被网友采纳

Answer 5

兄弟，我介意你还是用jQuery写吧，代码很简单

$(".font").css("color", "blue");

 希望能帮到您，谢谢！

本回答被提问者采纳