2015-05-19 131 views
-1

任何人都可以告訴我如何使用javascript獲取動態網頁數據或內容?使用JavaScript獲取動態網頁數據

與php函數類似get_file_content() page_value = get_file_content(http://www.mywebsite.com/page.html);

但它是在JavaScript中。 這可能嗎?

+0

jQuery的'.load()'和'阿賈克斯()'函數用於從web服務器加載數據。另見http://stackoverflow.com/tags/ajax/info。但是,這隻會將請求發送回原始服務器,除非遠程服務器啓用了CORS。 – Paul

回答

0

你必須使用Ajax

例在Javascript中

<!DOCTYPE html> 
<html> 
<head> 
<script> 
function loadXMLDoc() 
{ 
var xmlhttp; 
if (window.XMLHttpRequest) 
    {// code for IE7+, Firefox, Chrome, Opera, Safari 
    xmlhttp=new XMLHttpRequest(); 
    } 
else 
    {// code for IE6, IE5 
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
xmlhttp.onreadystatechange=function() 
    { 
    if (xmlhttp.readyState==4 && xmlhttp.status==200) 
    { 
    document.getElementById("myDiv").innerHTML=xmlhttp.responseText; 
    } 
} 
xmlhttp.open("GET","Your URL",true); 
xmlhttp.send(); 
} 
</script> 
</head> 
<body> 

<h2>AJAX</h2> 
<button type="button" onclick="loadXMLDoc()">Request data</button> 
<div id="myDiv"></div> 

</body> 
</html> 

您還可以在Jquery AjaxJquery Ajax Doc

例jQuery中Taken from Here

$.ajax({ 
    url: 'getTwitterFollowers.php', 
    type: 'GET', 
    data: 'twitterUsername=jquery4u', 
    success: function(data) { 
    //called when successful 
    $('#ajaxphp-results').html(data); 
    }, 
    error: function(e) { 
    //called when there is an error 
    //console.log(e.message); 
    } 
}); 
----------------------------------------------------- 
PHP - GET NUMBER FACEBOOK FANS & TWITTER FOLLOWERS 
----------------------------------------------------- 
< ?php 
//get data passed to script 
$username = htmlspecialchars(strip_tags($_GET["twitterUsername"])); 

//get twitter followers 
$api_page = 'http://twitter.com/users/show/' . $username; 
$xml = file_get_contents ($api_page); 
$profile = new SimpleXMLElement ($xml); 
$count = $profile->followers_count; 
$tfans = strval ($count); 

//get facebook likes 
$fuser = json_decode(file_get_contents('http://graph.facebook.com/140918675956744/')); 

//return result 
echo "jQuery4u has " . $fuser->likes . " Facebook fans and " . $tfans . " Twitter followers."; 
?> 

跨域阿賈克斯叫你將需要JSONP 例 jsonp.php

<?php 
    $callback ='mycallback'; 

    if(isset($_GET['mycallback'])) 
    { 
     $callback = $_GET['mycallback']; 
    } 
    $arr =array(); 
    $arr['name']="Ravishanker"; 
    $arr['age']=32; 
    $arr['location']="India"; 

    echo $callback.'(' . json_encode($arr) . ')'; 

?> 

jQuery代碼爲JSONP

$.ajax({ 
     url : "http://hayageektest.appspot.com/cross-domain-cors/jsonp.php", 
     dataType:"jsonp", 
     jsonp:"mycallback", 
     success:function(data) 
     { 
      alert("Name:"+data.name+"nage:"+data.age+"nlocation:"+data.location); 
     } 
    }); 

來自實例here

+0

我強烈建議使用jQuery的ajax,因爲這有各種改進和跨瀏覽器可靠性修復。 – ascx

+0

通過此過程我可以在同一個域中獲取本地頁面或頁面但是我想要獲取外部動態頁面。 xmlhttp.open("GET","http://stackoverflow.com/questions/30317015/get-dynamic-webpage-data-using-javascipt",true); 如何獲得外部動態頁面數據? –

+0

是的..通過這種方式你可以處理本地頁面,即相同的域..要訪問另一個域上的頁面'遠程服務器必須啓用CORS'然後只有ajax會得到結果..無論您試圖通過ajax訪問遠程服務器..看看CORS是否啓用 – DarkHorse

0

兩者我覺得我得到了一個完美的解決方案。這可以通過YQL完成。這是代碼。

<html> 
 
<head> 
 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
 
    
 

 
    <script type="text/javascript"> 
 
    $(document).ready(function(){ 
 
     var container = $('#show'); 
 
     $('.ajaxtrigger').click(function(){ 
 

 
     doAjax($(this).attr('href')); 
 
     return false; 
 
     }); 
 
     function doAjax(url){ 
 
     alert(url); 
 

 
var data = "http://ronwe.com/ronwe-marketing-suite/"; 
 
     if(url.match('^http')){ 
 
      $.getJSON("http://query.yahooapis.com/v1/public/yql?"+ 
 
        "q=select%20*%20from%20html%20where%20url%3D%22"+ 
 
        encodeURIComponent(data)+ 
 
        "%22&format=xml'&callback=?", 
 
      function(data){ 
 
       if(data.results[0]){ 
 
       var data = filterData(data.results[0]); 
 
       container.html(data); 
 

 
       } else { 
 
       var errormsg = '<p>Error: could not load the page.</p>'; 
 
       container.html(errormsg); 
 
       } 
 
      } 
 
     ); 
 
     } else { 
 
      $('#target').load(url); 
 
     } 
 
     } 
 
     function filterData(data){ 
 
     data = data.replace(/<?\/body[^>]*>/g,''); 
 
     data = data.replace(/[\r|\n]+/g,''); 
 
     data = data.replace(/<--[\S\s]*?-->/g,''); 
 
     data = data.replace(/<noscript[^>]*>[\S\s]*?<\/noscript>/g,''); 
 
     data = data.replace(/<script[^>]*>[\S\s]*?<\/script>/g,''); 
 
     data = data.replace(/<script.*\/>/,''); 
 
     return data; 
 
     } 
 
    }); 
 
    </script> 
 

 
    </head> 
 

 
    <body> 
 
    <a href="http://ronwe.com/ronwe-marketing-suite/" class="ajaxtrigger loaded">Load Ajax Content<span> (ready.)</span></a> 
 

 
    <div id="show"> 
 
    </div> 
 
    </body> 
 

 
</html>