a HREF link in an IFrame to change href value

Question

is it possible change or append hyperlink in a iframe?

Here is my code:

 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

    <script type="text/javascript">
    function changelinks(iframe){
      var as = iframe.contentDocument.getElementsByTagName('a');
      for(i=0;i<as.length;i++){
        as[i].setAttribute('href',"http://www.yahoo.com");
      }

    }

    </script>
    </head>

    <body>
    <iframe src="http://www.google.com" onload="changelinks(this)"></iframe>

My goal is when click on any link under iframe, destination url will be www.yahoo.com.

any suggestion is welcome. UPDATE I fetch website in iframe not located in my server.

Is this because all the links in the iframe link to yahoo.com? If so, see [here](http://stackoverflow.com/questions/1037839/how-to-force-link-from-iframe-to-be-opened-in-the-parent-window). — Wilf, Feb 22 '14 at 20:43
You don't need `setAttribute`, can't you just do `as[i].href = 'http://www.yahoo.com'`? — Cilan, Feb 22 '14 at 20:43
@TheWobbuffet "can't you just do as[i].href = 'http://www.yahoo.com'? " hahaha thanks — Nand Lal, Feb 22 '14 at 21:13
Are you trying to load an external url? See @dschibait answer. — jaapaurelio, Feb 22 '14 at 21:35

score 2 · Answer 1 · answered Feb 22 '14 at 20:45

2

Since you are using jquery.

function changelinks(iframe) {
    var frame = $( iframe ).get(0).contentDocument;

    $( 'a', frame ).click(function( event ) {
        event.preventDefault();
        location.href = 'http://yahoo.com';
    });
}

Or changing element attribute:

function changelinks(iframe) {
    var frame = $( iframe ).get(0).contentDocument;

    $( 'a', frame ).each(function() {
        $(this).attr('href', 'http://yahoo.com');
    });
}

answered Feb 22 '14 at 20:45

jaapaurelio

274
4
16

thanks for suggestion, still did not work. Note: I fetch website in iframe not located on my server. – Nand Lal Feb 22 '14 at 21:16

score 0 · Answer 2 · answered Feb 22 '14 at 21:24

0

If the iframe url is an external url you run into an injection security issue...

see this: https://developer.mozilla.org/en-US/docs/HTTP/Access_control_CORS this means you can only access DOM on your domain sites. you can do some php "proxy" hacks, where you can change the href attr but with simple javascirpt its not working.

(btw: there are some greasemonkey ways, but i think this is not an option for your site :))

regards Thomas

answered Feb 22 '14 at 21:24

dschibait

104
4

If you show example code via php proxy hack, I'll be highly appreciate. – Nand Lal Feb 23 '14 at 09:35
You can get the site html by file_get_contents() (using the uri). now you need to replace the href value like this call: $pageHTML = preg_replace('#href=\"(.*)\"#isU', "href=\"" . $url . "\"", $pageHTML); (not tested) – dschibait Feb 23 '14 at 11:47

a HREF link in an IFrame to change href value

2 Answers2