Is it possible to grab a link by its href if it doesn't have a class or ID?

问题

I'm using someone else's app and want to change the innerHTML in between any < a>< /a> tag that has a certain href. But these links don't have a class or ID associated with them and I can't edit the code to give them classes or ID's. Is there a way to grab a tag by its href in JavaScript? I wanted to do something similar to this:

var theLink = document.getElementByHref("example.com");

Otherwise, if that is not possible, can I loop through all the links in the page and choose the ones that have the certain href and innerHTML I'm looking for?

回答1:

You can use a DOM3-attribute-selector (jQuery doc) to get all elements that contain a certain text in their href attribute. It would look like

$('a[href*="example.com"]')

However, that might not be what you actually want - not only urls to that domain might contain this string. You might do something like begins-with:

$('a[href^="http://example.com"]')

but to get an exact and possibly more complex match, you don't get around a custom filter:

$('a[href]').filter( function() {
     return this.hostname == "example.com";
     // or check other properties of the anchor element
})

回答2:

Select all elements that have the example.com value in href attribute:

Live Demo: http://jsfiddle.net/NTGQz/

$('a[href*="example.com"]');

You can also try this, just to be more specific and following the OP "ideal" answer:

Live Demo: http://jsfiddle.net/ksZhZ/

jQuery.fn.getElementsByHref = function(str){ return $('a[href*="' + str + '"]'); };

$(document).ready(function(){        
   elems = $(this).getElementsByHref('example.com');
});

回答3:

jQuery has a lot of selectors. The one you want here is the attribute selector.

$('a[href="example.com"')

回答4:

You can use an attribute selector:

$('a[href="http://example.com"]')

回答5:

With JQuery attribute selector, you can do this :

$('a[href="example.com"]')

回答6:

Try this

$('a[href*="example.com"]');

This will select the link that has example.com in the href attribute..

回答7:

$('a[href="http:google.com"]')

回答8:

you can do it with jquery: http://api.jquery.com/attribute-equals-selector/

ex: linksToGoogle = $('a[href="http://google.com"]');

回答9:

You can do this without jQuery.

var links = document.querySelectorAll('a[href*="example.com"]');

回答10:

You can do this natively with querySelectorAll if your users are on IE8+ or any other browser. This method returns an NodeList of matching elements.

document.querySelectorAll('a[href="exact/value.html"]');    // exact match
document.querySelectorAll('a[href*="partial/value.html"]'); // partial match
document.querySelectorAll('a[href^="starts/with"]');        // href starts with
document.querySelectorAll('a[href$=".html"]');              // href ends with

来源：https://stackoverflow.com/questions/12823144/is-it-possible-to-grab-a-link-by-its-href-if-it-doesnt-have-a-class-or-id

标签

javascript

jquery

html