简单的屏幕抓取使用jQuery

Simple Screen Scraping using jQuery

本文关键字：jQuery 抓取 屏幕 简单      更新时间：2023-09-26

我一直在考虑使用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中?

使用$.ajax将另一个页面加载到一个变量中，然后创建一个临时元素并使用.html()将内容设置为返回的值。循环遍历nodeType 1的元素的子节点，并保留它们的第一个子节点的nodeValues。如果外部页面不在您的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
          }
     }
});

使用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
    } )
} );

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

如果这是针对同一域，那么没有问题- jQuery解决方案是好的。

但是你不能从任意网站访问内容，因为这被认为是安全风险。参见同源策略。

当然有一些服务器端解决方法，比如web代理或CORS标头。如果你幸运的话，他们会支持json。

但是如果你想要一个客户端解决方案与任意网站和web浏览器一起工作，那么你就不走运了。有建议放宽此政策，但这不会影响当前的web浏览器。

您可能需要考虑pjscraper:

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

它允许您使用javascript和jQuery从命令行执行此操作。它通过使用PhantomJS来实现这一点，这是一个无头webkit浏览器(它没有窗口，它只存在于你的脚本使用，所以你可以加载使用AJAX的复杂网站，它将像一个真正的浏览器一样工作)。

示例不言自明，我相信这适用于所有平台(包括Windows)。

使用YQL或Yahoo管道对原始页面html内容发出跨域请求。yahoo管道或YQL查询将把它返回为JSON，可以由jquery处理以提取和显示所需的数据。

缺点:YQL和Yahoo管道服从目标域的robots.txt文件如果页面太长，雅虎管道regex命令将无法运行

我相信您在许多情况下都会遇到请求的CORS问题。从这里尝试解决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);
});
相关文章：