跟进 an earlier question .我有以下脚本:
document.querySelector('.clickme').addEventListener('click', function() {
this.style.color = '#f00';
this.style.backgroundColor = '#fff';
});
...这意味着当单击/点击 div .clickme
时,脚本会更改 .clickme
自己的 color
和 背景颜色
属性。现在,我需要的脚本不是更改 .clickme 的
自己的属性,而是更改页面上另一个元素的 color
和 backgroundColor
,a div 类(我们称之为).zebra
。应该如何修改脚本来实现这一点? (点击/点击的目标仍然是 .clickme
。)
最佳答案
您可以在点击事件处理程序中使用 document.querySelector('.zebra')
document.querySelector('.clickme').addEventListener('click', function() {
this.style.color = '#f00';
this.style.backgroundColor = '#fff';
document.querySelector('.zebra').style.color = 'blue';
document.querySelector('.zebra').style.backgroundColor = 'grey';
});
document.querySelector('.clickme').addEventListener('click', function() {
this.style.color = '#f00';
this.style.backgroundColor = '#fff';
document.querySelector('.zebra').style.color = 'blue';
document.querySelector('.zebra').style.backgroundColor = 'grey';
});
<div class='clickme'>Click me</div>
<div class='zebra'>Zebra</div>
关于javascript - 使用 document.querySelector ('.' ).style。更改不同 div 的 *两个* CSS 属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56689908/