假设我有以下 div:
<div class="device iphone5 black"></div>
我想要一个切换按钮来更改设备。因此,应更改类。但是,不仅 .iphone5
应该更换,颜色.black
也应该更换。
我有以下数组:
var devices = [
'.iphone5 .black',
'.nexus5',
'.iphone4s .black',
'.lumia920 .blue',
'.s5 .white',
'.htc-one'
];
我如何制作一个切换器来检查一个 div 是否带有 .device
类具有数组中定义的类之一,然后用下一个替换它?像这样的东西:
<script>
$('.device').filter(devices.join())$('.device').is(devices.join("")
.attr('class', 'device ' + devices[NEXT]);
</script>
最佳答案
遍历数组,搜索与当前选择器匹配的所有元素,并用下一个数组元素替换类。
你必须反向循环数组。否则,当你把.iphone5.black
改成.nexus5
后,下一次迭代会把它改成.iphone4s.black
,一切就结束了到数组中的最后一个类。
for (var i = devices.length-2; i >= 0; i--) {
$(".device" + devices[i]).attr("class", "device " + devices[i+1].replace(/\./g, ' '));
}
此外,您需要从 devices
中的值中取出空格。 .iphone5 .black
表示搜索 .iphone5
的子类为 black
,但您希望这些类应用于相同的元素,所以它应该是 .iphone5.black
。
关于javascript - Jquery - 替换数组中定义的多个类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44304410/