Extract URL from HTML using Javascript and use it in a function

Question

I need to extract URL link from html.

<a rel="nofollow" href="link" class="1">

There is only one such link on the whole page.

Then I need to add use it as a.href in this function:

function changespan() {
    var spans = document.querySelectorAll('span.image');
    for (var i = spans.length; i--; ) {
        var a = document.createElement('a');
        a.href = "http://domain.com";
        spans[i].appendChild(a).appendChild(a.previousSibling);
    }
}

Can you post your HTML where the 'link' needs to be extracted from? — DanC
– DanC, Commented Mar 11, 2013 at 14:47
If you know how to use querySelectorAll, what is the problem? oO — VisioN
– VisioN, Commented Mar 11, 2013 at 14:48
I just did few problems with formatting. Is marking links using class tag smart thing to do? — Zox
– Zox, Commented Mar 11, 2013 at 14:48
I do not know javascript syntax at all, so it would probably take a whole day for me to do this, and i guess this is a simple regex. Isn't it? — Zox
– Zox, Commented Mar 11, 2013 at 14:49
@Zox marking nodes with classes is super smart things to do! But better give some more meaningful names to your classes. Instead of 1 it could be external-link, etc. — dfsq
– dfsq, Commented Mar 11, 2013 at 14:49

dfsq · Accepted Answer · 2013-03-11 15:00:08Z

1

Try this:

function changespan() {
    var spans = document.querySelectorAll('span.image'),
        href = document.querySelector('.nofollow-link').href;
    for (var i = spans.length; i--; ) {
        var a = document.createElement('a');
        a.href = href;
        spans[i].appendChild(a).appendChild(a.previousSibling);
    }
}

but change you link class to something else then 1 it can't start with number:

<a rel="nofollow" href="link" class="nofollow-link">Link</a>

http://jsfiddle.net/Tqv76/2/

edited Mar 11, 2013 at 15:00

answered Mar 11, 2013 at 14:54

dfsq

193k26 gold badges244 silver badges261 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Zox Over a year ago

Work very well. Thanks for tip that classes cannot start with numbers.

dfsq Over a year ago

You are welcome. I would appreciate if you accepted the answer (and the previous).

Zox Over a year ago

I didn't know that there is this option. How would i combine functions changespan1 and another one lets say changespan2?

isherwood · Accepted Answer · 2013-03-11 14:49:21Z

0

document.getElementsByTagName("a")[0].getAttribute("href");

answered Mar 11, 2013 at 14:49

isherwood

61.4k16 gold badges122 silver badges173 bronze badges

3 Comments

Zox Over a year ago

So I say a.href = document.getElementsByTagName("a")[0].getAttribute("href"); ?

isherwood Over a year ago

I'd think so. Give it a go.

isherwood Over a year ago

The [0] implies the first anchor in the page, so I'm not sure if that's appropriate in your case.

codeVerine · Accepted Answer · 2013-03-11 14:50:54Z

0

function changespan() {
    var spans = document.querySelectorAll('span.image');
    for (var i = spans.length; i--; ) {
        var a = document.createElement('a');
        a.href = $(".1").attr('href');
        spans[i].appendChild(a).appendChild(a.previousSibling);
    }
}

answered Mar 11, 2013 at 14:50

codeVerine

7623 silver badges14 bronze badges

4 Comments

dfsq Over a year ago

1) there is no jQuery. 2) Never do things like that (query DOM in loops).

codeVerine Over a year ago

All of us know that there is jQuery. Then why are you pretending like it is not existing ?

dfsq Over a year ago

How do you know that OP has jQuery?

Zox Over a year ago

I have but as @dfsq said class name cannot start with a number.

Collectives™ on Stack Overflow

Extract URL from HTML using Javascript and use it in a function

3 Answers 3

3 Comments

3 Comments

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

3 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related