javascript - 如何触发 JavaScript 中元素的点击

Question

我有以下 Html:

<div class="box-row">
    <div class="box c2-3">
        <div class="box-overlay"></div>
        <div class="box-letter"></div>
    </div>
    <div class="box c2-4">
        <div class="box-overlay"></div>
        <div class="box-letter"></div>
    </div>
    <div class="box c2-5">
         <div class="box-overlay"></div>
         <div class="box-letter"></div>
    </div>
    <div class="box c2-6 trr">
         <div class="box-overlay trr"></div>
         <div class="box-letter"></div>
    </div>
 </div>

我想随机选择具有以下类的元素之一:c2-3、c2-4、c2-5、c2-6 并触发点击。

这是我迄今为止的代码:

    var map = [
        'c2-3', 'c2-4', 'c2-5', 'c2-6',
    ];

    var x = Math.floor((Math.random() * 4));
    var element = document.getElementsByClassName(map[x]);

此时我想触发点击，但不确定如何执行:

 element.trigger('click'); ??

Answer 1

使用element.click();而不是 element.trigger('click'); 而且，您需要只获取单个元素，或者循环返回的 HTMLCollection来自.getElementsByClassName() .

例如，循环:

var elements = document.getElementsByClassName(map[x])
elements.forEach(element => element.click())

...或者，获取单个元素(仍然使用 getElementsByClassName):

var element = document.getElementsByClassName(map[x])[0]
element.click()

或者，您可以使用querySelector :

var element = document.querySelector(`.${map[x]}`)
element.click()