<分区>
我正在研究一个简单的例子，如果用户点击元素，那么它上面的所有元素都应该有一个类，而它下面的所有元素都不应该应用任何类。
这是我的代码:
<script>
function test(object) {
var pid = object.id;
var id = parseInt(pid.split("")[1]);
console.log(id);
for (var i = 1; i <= id; i++) {
var element = document.getElementById("p"+i);
console.log(element);
element.className = "active";
}
console.log(id+1);
for(var i = id+1; i <= 4; i++) {
var element = document.getElementById("p"+i);
element.className.replace(new RegExp('(?:^|\\s)'+ 'active' + '(?:\\s|$)'), ' ');
console.log(element);
}
}
</script>
<div id="divid">
<p id="p1" onclick="test(this)">one</p>
<p id="p2" onclick="test(this)">two</p>
<p id="p3" onclick="test(this)">three</p>
<p id="p4" onclick="test(this)">four</p>
</div>
所以在这里，如果我点击三，那么一、二、三的元素应该有类 active 而元素四不应该有任何类。这工作正常。
现在，如果我点击一个，我希望二、三、四应该有任何 css 类，但它不是那样工作的。
你能帮我看看问题出在哪里吗？我想使用纯 Javascript。