如何parsingDOM（REACT）
我正试图从网站上刮取数据。 该网站使用Facebook的React。 因此，我可以使用Jauntparsing的源代码与使用Chrome的检查器检查元素时看到的代码完全不同。
我对这一切知之甚less，但已经做了一些研究，我认为这与DOM而不是源代码有关。 我需要一种方式来获得这个DOM代码，因为原始代码中没有我想要的东西，但是我没有最开始的想法（甚至在这里读了许多答案）。
这是一个我想刮的页面的例子。 例如，要抓取描述我想要抓住标签之间的内容：
<span class="light-font extended-card-description list-group-item">Example description....</span> 但是，正如你所看到的，这个元素只有在“ 检查元素 ”时才会出现，而不是当我查看页面的源时。
我在这里给你的天才们提出的问题是，我怎样才能抓住这个DOM代码，并开始抓取我真正想要的元素？
原谅我，如果我的术语是完全closures，但正如我所说这是一个全新的领域，我已经做了我可以研究。
提前非常感谢！
ReactJS和许多其他Javascript库/框架一样，使用客户端代码（Javascript）来呈现最终的HTML。 这意味着，当您，Jaunt或您的浏览器从服务器获取HTML源代码时，它还不包含用户将看到的最终代码。 浏览器需要运行页面中包含的Javascript程序，以便生成你想要的最终内容。
我最喜欢的工具是CasperJS
它（或者CasperJS使用的PhantomJS工具）是一个无头浏览器，意味着它是一个已经被所有GUI（窗口，button，菜单）剥离的Webkit版本（如Chrome或Safari）。剩下的是一个工具您可以从terminal或Java程序运行。 它不会在屏幕上显示任何窗口，但会提取您要求的网页; 运行它们包含的任何Javascript; 然后响应你的命令，比如“点击这个链接”，“给我那个文本”，“截图截图”等等。
让我们从一个简单的ReactJS例子开始 ：
我们想刮掉“Hello John”文本，但是如果你看看纯粹的HTML源代码（ Ctrl + U或者Alt + Ctrl + U ），你将看不到它。 另一方面，如果您在浏览器中打开控制台并使用以下select器，则会显示以下文本：
> document.querySelector('#helloExample .playgroundPreview').textContent "Hello John"
这是一个简单的CasperJS脚本来做同样的事情：
var casper = require("casper").create(); casper.start("http://facebook.github.io/react/index.html", function() { this.echo(this.fetchText("#helloExample .playgroundPreview")); }); casper.run();
您可以将其另存为hello.js并从terminal执行casperjs hello.js ，或者使用等效的Java代码Runtime.getRuntime().exec(...)
这是一个更好的脚本，它可以避免加载图像和第三方资源（如Facebookbutton，Twitterbutton，Google Analytics等）将加载时间减半。 它还增加了一个waitForSelector步骤，这样我们就不会冒险尝试在ReactJS有机会创build它之前获取文本。
var casper = require("casper").create({ pageSettings: { loadImages: false } }); casper.on('resource.requested', function(requestData, request) { if (requestData.url.indexOf("http://facebook.github.io/") != 0) { request.abort(); } }); casper.start("http://facebook.github.io/react/index.html", function() { this.waitForSelector("#helloExample .playgroundPreview", function() { this.echo(this.fetchText("#helloExample .playgroundPreview")); }); }); casper.run();
如何安装CasperJS
我用PhantomJS和CasperJS的老版本来解决ReactJS和其他现代Javascript页面的问题，所以我build议从GitHub安装PhantomJS 2.0和最新的CasperJS。
对于PhantomJS，您可以下载官方2.0软件包 。
对于CasperJS来说，因为它是一个Python脚本，所以你应该能够从GitHub中检出最新的提交，并把bin/casperjs链接到PATH上。 这是Linux或Mac OS X的脚本：
> git clone git://github.com/n1k0/casperjs.git > cd casperjs > ln -sf `pwd`/bin/casperjs /usr/local/bin/casperjs
您可能还想从bin/bootstrap.js文件中注释掉打印Warning PhantomJS v2.0 ...的行。