如何在javascript中將DOM元素作為參數傳遞？

Question

我想將myVideo元素作為參數傳遞給play（）函數，但是它不起作用？ （它會自動播放視頻，而eventListener不再起作用）

如果我直接在函數中使用元素，它將起作用。 所以我想知道是否有可能將DOM元素作為參數傳遞，如果可以，是否曾經使用過

這是下面的代碼：

// Get our elements
const myVideo = document.querySelector(".player__video");
const playButton = document.querySelector(".player__button");
console.log(myVideo);

function play(video) {

    if (video.paused) {
        video.play();
    } else {
        video.pause();
    }
}

playButton.addEventListener('click', play(myVideo))

Answer 1

playButton.addEventListener('click', function(){play(myVideo)})

您需要傳遞一個函數，但是您傳遞的是函數的結果。 JavaScript具有一流的功能，因此請習慣一下。

Answer 2

const myVideo = document.querySelector(".player__video");
const playButton = document.querySelector(".player__button");
console.log(myVideo);

function play(video) {

    if (video.paused) {
        video.play();
    } else {
        video.pause();
    }
}

playButton.addEventListener('click', () => play(myVideo) );

將有效。 addEventListener要求第二個參數作為Function，但是您傳遞了一個未定義的值。