我正在使用JavaScript执行一个小文本,getElementsByClassName()并且我得到了一些不需要的结果.我希望脚本将每个CSS类更改为一个新类.问题是每个其他班级只会改变......
我想使用纯js这个问题是如何用于练习目的.
我想到的第一件事就是白色空间,虽然在移除它时没有任何不同.
谁能指出我做错了什么？
<html>
<head>
<link rel="stylesheet" type="text/css" href="default.css">
</head>
<body>
<div class="block-default">BLOCK1</div>
<div class="block-default">BLOCK2</div>
<div class="block-default">BLOCK3</div>
<div class="block-default">BLOCK4</div>
<div class="block-default">BLOCK5</div>
<div class="block-default">BLOCK6</div>
<div class="block-default">BLOCK7</div>
<div class="block-default">BLOCK8</div>
<script>
var blockSet = document.getElementsByClassName("block-default");
var blockSetLength = blockSet.length;
blockSet[0].className = "block-selected";
blockSet[1].className = "block-selected";
blockSet[2].className = "block-selected";
blockSet[3].className = "block-selected";
blockSet[4].className = "block-selected";
blockSet[5].className = "block-selected";
blockSet[6].className = "block-selected";
blockSet[7].className = "block-selected";
</script>
</body>
</html>
CSS类:
.block-default {
width: 100px;
height:50px;
background-color: green;
border: 1px solid red;
padding:10px;
} …我只想将一个类名改为另一个.
我试过用了
document.getElementsByClassName("current").setAttribute("class", "none");
但它不起作用.我是javascript的新手.
好吧，我在我的 Html 中放置了类名“gone”的 tablerows，如下所示：
<tr class="gone">
<th>text</th>
<td>text</td>
</tr>
<tr class="gone">
<th>text</th>
<td>text</td>
</tr>
<tr class="gone">
<th>text</th>
<td>text</td>
</tr>
<tr class="gone">
<th>text</th>
<td>text</td>
</tr>
<tr class="gone">
<th>text</th>
<td>text</td>
</tr>
<tr class="gone">
<th>text</th>
<td>text</td>
</tr>
当我使用以下代码在 javascript 中获取元素时：
var arrayelements=document.getElementsByClassName('gone');
var arrlength=arrayelements.length;
for(var i=0;i<arrlength;i++){
arrayelements[i].setAttribute("class","there");
console.log(arrayelements);
}
我的 console.log 的返回值是
> <tr class="there">...</tr>
> <tr class="there">...</tr>
> <tr class="there">...</tr>
> undefined
下次我运行它的结果是
> <tr class="there">...</tr>
> <tr class="there">...</tr>
> undefined
我不明白为什么它突然未定义