0

This is a variation of an existing question

{Please note - this question is the opposite/inverse of an existing StackOverflow question that is too complex to answer there}

From the very beginning

I want to make some refinement to some code from this challenge:

// the new base url
var base = ' https://www.example.co.uk/gp/wine/order?ie=UTF8&asin=';
var links  = document.getElementsByTagName('a');

for(var i = 0;i < links.length;i++){
    // check each link for the 'asin' value
    var result = /asin=([\d\w]+)/.exec(links[i].getAttribute('href'));
    if(result){
        // make a new url using the 'base' and the 'asin' value
        links[i].setAttribute('href', base+result[1]);
    }
}

Now, instead of it acting on all links, can I get it to only look at links that are from text?

Here is an HTML snippet to show what I mean:

<a href="/shop/product?ie=UTF8&amp;asin=Z00FDLN878&amp;tab=UK_Default" target="_blank"><img width="125" height="125" border="0" src="http://ecx.images-amazon.com/images/I/01W9a7gwosL.jpg" alt="43453"></a>

That's an image link - I do NOT want it to act on that.

Community
  • 1
  • 1
Elle
  • 375
  • 1
  • 2
  • 12

2 Answers2

1
if (links[i].querySelector('img')) {
    // Link has an <img>! Oh no!
}

To support older browsers, call getElementsByTagName() instead (and check for an empty array).

SLaks
  • 868,454
  • 176
  • 1,908
  • 1,964
  • Can you please give the full code so I can test it? (in the way that Brock Adams has done at http://stackoverflow.com/questions/20255051/how-can-i-refine-this-javascript-code-to-refine-it-so-it-only-work-on-links-from) – Elle Dec 19 '13 at 18:47
  • @Ted: What don't you understand? Just put that in your loop to skip those elements. – SLaks Dec 19 '13 at 19:14
  • I have a vague idea of how to proceed but I inevitably misplace a comma or period and break things. Do I put it (`if (links[i].querySelector('img')) {`) in line 4 and add `}` to the end? – Elle Dec 19 '13 at 19:46
  • Shall I insert it into line 8? (Sorry if this is a stupid question). Once I've confirmed it has worked I'll gladly accept ("green tick") your answer. – Elle Dec 27 '13 at 08:10
  • Ah, I think I finally understand this. If link has an `` then I want it to do nothing, so **can I make it continue with the for loop with no action**? – Elle Mar 25 '14 at 14:36
1

In straight javascript / DOM, test the links as you loop through them:

var base        = 'https://www.example.co.uk/gp/wine/order?ie=UTF8&asin=';
var linksNoImg  = document.querySelectorAll ("a[href*='asin']");

for (var J = linksNoImg.length - 1;  J >= 0;  --J) {
    var imgLink = linksNoImg[J];

    //--- Make sure it's not an image link:
    if ( ! imgLink.querySelector ('img') ) {
        //--- Check each link for the 'asin' value
        var result  = /asin=([\d\w]+)/.exec (imgLink.getAttribute ('href') );
        if (result) {
            // make a new url using the 'base' and the 'asin' value
            imgLink.setAttribute ('href', base+result[1]);
        }
    }
}


jQuery lets you preselect only the correct links:

//--- The new base URL
var base        = ' https://www.example.co.uk/gp/wine/order?ie=UTF8&asin=';
var linksNoImg  = $("a[href*='asin']:not(:has(img))");

linksNoImg.each ( function () {
    // check each link for the 'asin' value
    var result = /asin=([\d\w]+)/.exec(links[i].getAttribute('href'));
    if(result){
        // make a new url using the 'base' and the 'asin' value
        links[i].setAttribute('href', base+result[1]);
    }
} );


But this requires you to load jQuery in Greasekit -- which is well worth it for any but the simplest scripts.

Brock Adams
  • 90,639
  • 22
  • 233
  • 295