如何使用JavaScript模拟对此按钮的点击
我尝试了document.querySelector('.button.input-button.blue').click();
,但是它不起作用。
document.querySelector('.button.input-button.blue').click();
<div class="page-text" style="position: absolute; top: 200px; left: 310px; right: 10px; text-align: center;">
<span style="font-size:24px;letter-spacing:1px;">138</span>
<span style="font-size:20px;letter-spacing:1px;">1</span>
<span style="font-size:24px;letter-spacing:1px;"> / </span>
<span style="font-size:24px;letter-spacing:1px;">138</span>
<span style="font-size:20px;letter-spacing:1px;">3</span>
</div>
<button class="input-button blue" style="position: absolute; top: 244px; right: 30px; width: 187px;">Fill</button>
<button class="input-button red" style="position: absolute; top: 244px; left: 330px; width: 187px;">Sell</button>
我希望点击“蓝色按钮”
最佳答案
您的选择器有误,应该是这样的document.querySelector('.input-button.blue')
您可以从MDN here检查querySelector文档,下面列出了快速摘要。
您可以使用.
表示类选择器,即选择具有特定类的元素。
您可以使用#
选择具有ID的元素
通过标签名称选择元素时button
,元素名称前没有任何内容
let btn = document.querySelector('.input-button.blue');
btn.addEventListener('click', function(){
console.log('Button clicked');
})
btn.click();
<div class="page-text" style="position: absolute; top: 200px; left: 310px; right: 10px; text-align: center;"><span style="font-size:24px;letter-spacing:1px;">138</span><span style="font-size:20px;letter-spacing:1px;">1</span><span style="font-size:24px;letter-spacing:1px;"> / </span><span style="font-size:24px;letter-spacing:1px;">138</span><span style="font-size:20px;letter-spacing:1px;">3</span></div>
<button class="input-button blue" style="position: absolute; top: 244px; right: 30px; width: 187px;">Fill</button>
<button class="input-button red" style="position: absolute; top: 244px; left: 330px; width: 187px;">Sell</button>