我有我的 p 標簽，它假設在我觸發滑鼠懸停事件時更改文本，但不知何故我得到了 [object MouseEvent] 而不是文本。
HTML
<p id="album-name-1"
onm ouseover="changeText('follow me around, greatest song of the album!')">
change the text
</p>
JS
var par = document.querySelector("#album-name-1");
par.addEventListener("mouseover", changeText);
function changeText(text) {
if (this.id === "album-name-1") {
par.innerHTML = text;
}
}
我想通過使用“this”關鍵字來做到這一點，但不知何故它并沒有像我期望的那樣作業。有什么建議？
uj5u.com熱心網友回復：
這是因為您添加了一個帶有 的mouseover事件偵聽器addEventListener，并且回呼的第一個引數是事件。
相反，您可以this在onmouseover屬性中作為引數傳遞。
var par = document.querySelector("#album-name-1");
function changeText(elem, text) {
if (elem.id === "album-name-1") {
par.innerHTML = text;
}
}<p id="album-name-1" onmouseover="changeText(this, 'follow me around, greatest song of the album!')">
change the text
</p>uj5u.com熱心網友回復：
不要使用事件屬性。它們充滿了難以除錯的怪癖，總有一天會咬你。
相反，如果您真的希望在標記中包含該文本，請將其存盤在一個data-屬性中并從您的事件處理程式中檢索它，您通過addEventListener.
var par = document.querySelector("#album-name-1");
par.addEventListener("mouseover", changeText);
function changeText(evt) { // first param is the Event object
if (this.id === "album-name-1") { // 'this' is the current target
// all the data- attributes of our element
// are stored in its .dataset property
par.innerHTML = this.dataset.text;
}
}<p id="album-name-1" data-text="follow me around, greatest song of the album!">
change the text
</p>轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/360661.html
標籤：javascript dom 这个