javascript - W3C Selectors API 实现 jquery Selector $('a span:contains("myText")')

Question

我想改变

$('a span:contains("myText")').click();

至

var ev = document.createEvent("MouseEvents");
ev.initEvent("click", true, true);
document.querySelector(???).dispatchEvent(ev);

什么是 ？？？我应该打字吗？

Answer 1

不幸的是，你所问的不能用一行来完成，因为 JavaScript 没有“包含”选择器。

您必须做的是'a span'使用所有元素document.querySelectorAll()，然后遍历它们并检查它们是否包含'myText'在其中。

这是一个示例FIDDLE

html:

<a href="/three"><span>banana button</span></a>
<a><span>orange button</span></a>

CSS：

span {
    width:100px;
    height:25px;
    border:2px solid red;
    cursor:pointer;
}

js：

var ev = document.createEvent("MouseEvents");
ev.initEvent("click", true, true);
var all_spans = document.querySelectorAll("a span");
for (i = 0; i < all_spans.length; i++) {
    if (all_spans[i].innerText.indexOf("banana")>-1) {
        all_spans[i].dispatchEvent(ev);
    }
}