用多个类定义的Javascript函数单击元素

Question

我试图单击一个按钮，但唯一定义它的是多个类。我想点击的元素是

<div class="U26fgb XHsn7e obPDgb M9Bg4d">This is a button </div>

如何使用Javascript点击？

Answer 1

只要它是唯一具有该类组合的<div>元素，您就可以使用.querySelector()，它接受任何有效的CSS选择器作为参数，这样您就可以像在CSS:中一样在JavaScript中选择元素

// Scan the document for the <div> that has the required classes
let theDiv = document.querySelector("div.U26fgb.XHsn7e.obPDgb.M9Bg4d");
// Set up a click event handling function
theDiv.addEventListener("click", function(){
console.log("you clicked me");
});

// Trigger the click event of the <div>
theDiv.click();

<div class="U26fgb XHsn7e obPDgb M9Bg4d">Click Me</div>

仅供参考：您应该改掉在HTML中的<和>分隔符内部添加空格的习惯。使用此：

<div class="U26fgb XHsn7e obPDgb M9Bg4d">Click Me</div>

不是这个：

< div class="U26fgb XHsn7e obPDgb M9Bg4d" >Click Me< /div >

Answer 2

使用jQuery:非常简单

$(".U26fgb.XHsn7e.obPDgb.M9Bg4d").click(function(){
console.log("clicked!");
}); 

Answer 3

const div = document.querySelector('div .M9Bg4d');
div.addEventListener("click", ()=> {
// here put what you wanna do after clicking the div.

})；

Answer 4

onclick属性在几乎所有的html标记中都能很好地工作，下面是单击div并获得结果的简单解决方案。祝你一切顺利！

function clickDiv(){
console.log("Div is Clicked");
}

<div class="U26fgb XHsn7e obPDgb M9Bg4d" onclick="clickDiv()">This is a button </div>