簡單的屏幕使用jQuery刮刮

我一直在玩使用jQuery簡單的屏幕刮板的想法，我想知道如果以下是可能的。簡單的屏幕使用jQuery刮刮

我有簡單的HTML網頁和我進行嘗試（如果可能的話），以抓住所有的列表項的內容從另一頁，像這樣：

主頁：

<!-- jQuery --> 
<script type='text/javascript'> 
$(document).ready(function(){ 
$.getJSON("[URL to other page]", 
    function(data){ 

    //Iterate through the <li> inside of the URL's data 
    $.each(data.items, function(item){ 
     $("<li/>").value().appendTo("#data"); 
    }); 

    }); 
}); 
</script> 

<!-- HTML --> 
<html> 
    <body> 
     <div id='data'></div> 
    </body> 
</html>

其他網頁：

//Html 
<body> 
    <p><b>Items to Scrape</b></p> 
    <ul> 
     <li>I want to scrape what is here</li> 
     <li>and what is here</li> 
     <li>and here as well</li> 
     <li>and append it in the main page</li> 
    </ul> 
</body>

那麼，是不是可能使用jQuery從外部頁面提取所有列表項內容並將它們追加到div內？

來源

2011-04-14 Rion Williams

也可以在JavaScript中獲取當前頁面的文本（無標籤）：http://stackoverflow.com/questions/5321739/how-can-i-get-the-text-only- no-tags-from-a-html-document – 2013-02-20 18:28:08

使用$.ajax將另一頁加載到變量中，然後創建一個臨時元素並使用.html()將內容設置爲返回的值。遍歷nodeType 1的元素的子節點並保留其第一個子節點的值。如果外部頁面不在您的Web服務器上，您將需要使用自己的Web服務器代理該文件。

事情是這樣的：

$.ajax({ 
    url: "/thePageToScrape.html", 
    dataType: 'text', 
    success: function(data) { 
      var elements = $("<div>").html(data)[0].getElementsByTagName("ul")[0].getElementsByTagName("li"); 
      for(var i = 0; i < elements.length; i++) { 
       var theText = elements[i].firstChild.nodeValue; 
       // Do something here 
      } 
    } 
});

來源

2011-04-14 18:53:19 Ryan

您可以詳細瞭解「代理文件」的含義嗎？ – 2014-03-31 23:01:28

@AdamYoungers：「代理文件」幾乎是一個完整的描述。向自己的服務器發出請求;讓您自己的服務器從目標中獲取請求的頁面。在Nginx中，它將是一個'proxy_pass'。如果你想用PHP來實現，你可以使用'<？php echo file_get_contents（$ _ GET ['proxy']）; ？>'。 – Ryan 2014-04-01 02:35:36

請確保將代理資源的內容類型列入白名單;添加並檢查指示XHR的自定義標題;避免公開代理;儘可能使用CORS，並將代理放在不同的域上。 – Ryan 2017-12-30 10:37:51

$.get("/path/to/other/page",function(data){ 
    $('#data').append($('li',data)); 
}

來源

2011-04-14 22:25:17

如果這是同一個域，那麼沒問題 - jQuery的解決方案是好的。

但是否則您無法從任意網站訪問內容，因爲這被認爲是安全風險。見same origin policy。

當然有服務器端的解決方法，如Web代理或CORS headers。如果你很幸運，他們會支持jsonp。

但是，如果你想要一個客戶端解決方案與任意網站和Web瀏覽器一起工作，那麼你運氣不好。有一個proposal to relax this policy，但這不會影響當前的Web瀏覽器。

來源

2011-04-15 02:24:14 hoju

有許多方法可以訪問域外的內容。例如： •jsonp •代理 – lightyrs 2011-10-01 05:40:35

相同來源策略在Safari上不是問題，並且已正確初始化Chrome – 2011-12-17 15:24:43

@LukeMcneice能解釋同一來源策略在safari和chrome中不是如何？也意味着什麼正確初始化？ – user566245 2012-07-09 19:19:25

使用YQL或Yahoo管道爲原始頁面html內容製作跨域請求。雅虎管道或YQL查詢會將其反轉爲可由jquery處理以提取和顯示所需數據的JSON。

缺點：YQL和Yahoo管道OBEY目標域的robots.txt文件，如果頁面太長，Yahoo Pipes regex命令將無法運行。

來源

2011-04-26 02:17:31 Skizz

你可能要考慮pjscrape：

http://nrabinowitz.github.io/pjscrape/

它可以讓你在命令行執行此操作，使用JavaScript和jQuery。它通過使用PhantomJS這是一個無頭webkit瀏覽器（它沒有窗口，它只存在於您的腳本的用法，因此您可以加載使用AJAX的複雜網站，它將工作，就像它是一個真正的瀏覽器一樣）。

這些示例是不言自明的，我相信這適用於所有平臺（包括Windows）。

來源

2013-09-27 05:22:37

簡單的拼搶與jQuery ...

// Get HTML from page 
$.get('http://example.com/', function(html) { 

    // Loop through elements you want to scrape content from 
    $(html).find("ul").find("li").each(function(){ 

     var text = $(this).text(); 
     // Do something with content 

    }) 

});

來源

2017-07-03 03:17:27 shramee

我相信你會打CORS問題在許多情況下請求。從here嘗試解決CORS問題。

var name = "kk"; 
var url = "http://anyorigin.com/go?url=" + encodeURIComponent("https://www.yoursite.xyz/") + name + "&callback=?"; 
$.get(url, function(response) { 
    console.log(response); 
});

來源

2018-03-09 19:09:59 Kurkula

簡單的屏幕使用jQuery刮刮

回答

相關問題