2 回答

TA貢獻(xiàn)1777條經(jīng)驗(yàn) 獲得超3個(gè)贊
有2個(gè)問(wèn)題:
一個(gè)錯(cuò)字,應(yīng)該是
mouseOverLoop.length
(不是lenght
)console.log()
沒(méi)有要記錄的字符串。
您可以使用事件的target
屬性來(lái)識(shí)別正確的元素,以及getAttribute
獲取屬性值的方法。
function hoverOver(e) {
console.log(e.target.getAttribute('data-animal'));
}
const mouseOverLoop = document.querySelectorAll("li");
for (let i = 0; i < mouseOverLoop.length; i++) {
console.log(mouseOverLoop[i]);
mouseOverLoop[i].addEventListener("mouseover", hoverOver);
}
function hoverOver(e) {
console.log(e.target.getAttribute('data-animal'));
}
<ul>
<li data-animal="horse">Animal 1</li>
<li data-animal="dog">Animal 2</li>
<li data-animal="cat">Animal 3</li>
</ul>

TA貢獻(xiàn)2065條經(jīng)驗(yàn) 獲得超14個(gè)贊
<ul id="animals">
<li data-animal="horse">Animal 1</li>
<li data-animal="dog">Animal 2</li>
<li data-animal="cat">Animal 3</li>
</ul>
document.getElementById("animals").addEventListener("mouseover", function({ target: { dataset } }) {
if (dataset.animal) {
console.log(dataset.animal);
}
});
添加回答
舉報(bào)