官方文檔http://phantomjs.org/api/

1.Mac OS X環(huán)境下載安裝PhantomJS

在終端鍵入如下命令


brew update
brew install phantoms


然后可以驗(yàn)證phantomjs是否安裝成功，鍵入


phantomjs --version


可以看到一個(gè)版本號(hào)，如：2.1.1

2.測(cè)試phantomjs

• 新建一個(gè)test.js文件，鍵入如下代碼

console.log('Hello Word');
phantom.exit();

• 保存后在終端cd到此test.js文件的父文件夾下，再輸入命令
  phantomjs test.js
  會(huì)打印Hello Word在終端。

3.熟悉phantoms

新建一個(gè)test2.js文件，鍵入如下代碼

console.log('Loading a web page');

var page = require('webpage').create();
var url = 'https://github.com/SoftProgramLX?tab=repositories';
page.open(url, function(status) {
    if(status != "success") {
        console.log('FAIL to load the address');
        phantom.exit();
    } else {
        console.log('Page is loaded!');
    }

    page.evaluate(function() {
        // window.scrollTo(0,10000);//滾動(dòng)到底部
        //window.document.body.scrollTop = document.body.scrollHeight;

        window.setTimeout(function() {
            var plist = document.querySelectorAll("a");
            var len = plist.length;
            while(len) {
                len--;
                var el = plist[len];
                el.style.border = "1px solid red";
            }
        }, 5000);
    });

    console.log(page.evaluate(function() {
        var d = ''
        var c = document.querySelectorAll('.repo-list-name > a')
        var l = c.length;
        for(var i = 0; i < l; i++) {
            d = d + c[i].textContent + '\n'
        }
        d = d + '共有'+ l + '個(gè)demo' + '\n'
        return d
    }))

    window.setTimeout(function() {
        page.render("js.png");
        phantom.exit();
    }, 5000 + 500);

});

功能：

a.將打開的網(wǎng)頁(yè)里的所有鏈接都加上"1px solid red"這樣的邊框。如下圖：

js.png

b.將將網(wǎng)頁(yè)截屏保存為js.png。如上圖

c.將我的github里的demo名稱都打印到終端或保存到txt文件。

• 輸入命令
  phantomjs test2.js
  后打印到了終端，如下圖：
  

0488388C-6C36-44F5-B03C-F2D9B7AF35D5.png

• 輸入命令
  phantomjs test2.js > result.txt
  后保存到了txt文件，如下圖：
  
  64875951-4A04-496A-AF5F-DF60674AECD5.png
  
  
  

代碼解析：

• 本例用我的github網(wǎng)址做測(cè)試，使用page.open(url, function(status)打開網(wǎng)址。
• phantom.exit();需要關(guān)閉PhantomJS。
• page.evaluate()提供了在page打開頁(yè)面的上下文執(zhí)行function的功能。
• document.querySelectorAll("a")；這是查詢所有的a元素。為了加上邊框。
• document.querySelectorAll('.repo-list-name > a')；這是查詢class為repo-list-name的元素的直接后代a元素。為了取到所有demo的名稱。

熟悉js與css是更好的操作PhantomJS爬蟲技術(shù)的必要條件。

QQ:2239344645 我的github