Question

我有这个HTML代码

 <div class="form-actions">
    <button type="submit" class="btn btn-success">I'm a button! Yayyy!</button> 
 </div>

我需要在JS中访问该按钮并单击它。我无法添加ID，因为它在网页上。（我使用tampermonkey / greasemonkey btw）

Answer 1

使用jQuery很容易做到。

$('.btn.btn-success:contains("I\'m a button! Yayyy!")')

^将是你的按钮。

如果此文本中没有其他按钮，则可以将解决方案缩小到：

$('button:contains("I\'m a button! Yayyy!")')

如果可以有其他按钮，包含此文本，并且您想要找到与其完全匹配的按钮，则解决方案将是

$(".btn.btn-success").each(function(){
    if($(this).html()=="I'm a button! Yayyy!"){
        //$(this) there is the button you want
    }
})

Answer 2

您可以选择页面上的所有button元素，然后使用.filter() method根据.textContent property过滤它们：

Example Here

var buttons = document.querySelectorAll('button');
var filteredButtons = Array.prototype.filter.call(buttons, function (el) {
    return el.textContent.trim() === 'Find based on this text.';
});

// Click the first button
filteredButtons[0].click();

当然，在您的情况下，您可以选择所有.btn-success元素作为类.form-actions的元素的后代：

var buttons = document.querySelectorAll('.form-actions .btn-success[type="submit"]');
var filteredButtons = Array.prototype.filter.call(buttons, function (el) {
    return el.textContent.trim() === 'Find based on this text.';
});

// Click the first button
filteredButtons[0].click();

在JS中找到基于innerhtml的HTML按钮并单击它

2 个答案: