How can my userscript get a link based on the link's text?

问题

Given this HTML on the target page:

<dd class="ddTit">
<a href="http://abc.xxx.com/54781.html" target="_blank">special text words</a>
</dd>

How can I get the url based on the "special text words", and do the click in a Greasemonkey script?

I tried this:

var textlink = document.querySelector ("dd.ddTit a[textContent*='special']");
var clickEvent      = document.createEvent ('MouseEvents');
clickEvent.initEvent ('click', true, true);
textlink.dispatchEvent (clickEvent);

with no luck.

How do I select based on the textContent, such as textContent contains the word special?

回答1:

Alas, you cannot do it with querySelector() because CSS selectors do not (yet) offer a content/text selector.

Here's 3 approaches:

Loop through a targeted selection of nodes:

var ddTitLinks  = document.querySelectorAll ("dd.ddTit a");

for (var J = ddTitLinks.length - 1;  J >= 0;  --J) {
    var ddTitLink   = ddTitLinks[J];
    //--- Case-insensitive search.
    if (/special text words/i.test (ddTitLink.textContent) ) {
        var clickEvent      = document.createEvent ('MouseEvents');
        clickEvent.initEvent ('click', true, true);
        ddTitLink.dispatchEvent (clickEvent);
        break;
    }
}

Use jQuery (a powerful library that will save you a ton of grief):

// ==UserScript==
// @name     _Click Special link(s)
// @include  http://YOUR_SERVER.COM/YOUR_PATH/*
// @require  http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
// ==/UserScript==

//--- Note that contains() is CASE SENSITIVE.
var specLink    = $("dd.ddTit a:contains('special text words')");
if (specLink.length) {
    var clickEvent  = document.createEvent ('MouseEvents');
    clickEvent.initEvent ('click', true, true);
    specLink[0].dispatchEvent (clickEvent);
}

Use XPath:

//--- Note that contains() is CASE SENSITIVE.
var specLinks   = document.evaluate (
    "//dd[contains(@class, 'ddTit')]/a[contains(text(), 'special text words')]",
    document,
    null,
    XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE,
    null
);

if (specLinks.snapshotLength) {
    var specLink    = specLinks.snapshotItem (0);
    var clickEvent  = document.createEvent ('MouseEvents');
    clickEvent.initEvent ('click', true, true);
    specLink.dispatchEvent (clickEvent);
}

回答2:

Here it is a greasemonkey script using jquery that performs what you want:

// ==UserScript==
// @name       your script
// @namespace  http://foobarfoobar.com/
// @version    0.1
// @description  Trigger click with jquery
// @require    http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js
// @match      http://*/*
// ==/UserScript==

(function () {
    $(document).ready(function(){
        $('dd.ddTit').find("a:contains('special text words')").bind('click', function() {
            window.location.href = this.href;
            return false;
        }).trigger('click');

    });
})();

if you copy some of this code to your script make sure to include the line:

// @require    http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js

so the jquery code works well, also adjust the @match rule to the specific site you want to apply the script.

回答3:

If you really have nothing but the content to identify the link, you may have to loop over all links to find the one you want:

var links = document.getElementsByTagName( 'a' );

for ( var i = 0; i < links.length; i++ ) {
    var link = links[i];
    if ( /special/.test( link.textContent ) ) {
        // do something with link
    }
}

来源：https://stackoverflow.com/questions/12375008/how-can-my-userscript-get-a-link-based-on-the-links-text

标签

javascript

css-selectors

greasemonkey

contains