Home/ Questions/Q 6894601
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-27T06:48:11+00:00

I am trying to make a program that grabs all the links from an

  • 0

I am trying to make a program that grabs all the links from an external website and display them using jQuery and PHP. Here are my steps:

  1. Get the html of a page using php (load.php)
  2. Put that html into a div
  3. Get all elements in that div

Here is my code (index.html):

<html>
<head>
    <title>Test</title>
    <script type="text/javascript" src="jquery.js">//jquery</script>
    <script type="text/javascript">
        $(function() { //on load
            var url = "http://google.com";
            $.post('load.php', { url: url},
                function(html) {
                    $('#page').html(html); //loads html from the page into a div

                    var links = $('#page > a');
                    alert('links.length: ' + links.length); //PROBLEM: returns 0 
                    for(var i=0; i < links.length; i++)
                    {
                        alert(links[i]);
                    }
            });
        });
    </script>
</head>
<body>
<div id="page" style=""></div>
</body>
</html>

And the php code (load.php):

<?php
$url = $_POST['url'];
$html = file_get_contents($url);
echo $html;
?>

The page is being loaded into the div correctly, so I know it is grabbing the html, but links.length is returning 0. So it is something wrong with this line:

var links = $('#page > a');

However, when I try to load it on my test page with html:

<a href="http://google.com">link1</a>
<a href="http://yahoo.com">link2</a>

links.length returns 2. Why does it work with my test page and not google?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    probably because your test page contains a document fragment (only the 2 links) while a page like google contains a whole document (starting with a doctype declaration and <html> and so on…).

    inserting such html into a div element probably breaks your DOM.

    I’d advise to

    1. parse the HTML serverside and pass only the results to your JS app.
      OR
    2. load the page (from your server) in an iframe and access it’s document to get to its link collection (documentOfIframe.links)
    • 0