gpt4 book ai didi

javascript - 使用 CasperJS 从 querySelectorAll 遍历 NodeList

转载 作者:行者123 更新时间:2023-11-29 10:41:17 24 4
gpt4 key购买 nike

我想遍历来自 querySelectorAll 的 NodeList。

不工作

var nodelist = this.evaluate(function() {
return document.querySelectorAll('tr.firstrow');
});

this.echo("nodelist.length=" + nodelist.length);

for (var i=0; i<nodelist.length; i++) {
this.echo("i=" + i);
line = nodelist[i];
this.echo("Line: " + line.innerText);
}

我得到的是这样的:

nodelist.length=3
i=0
this it the first line
i=1

在 i=1 之后,输出卡住。对于第一项,“for”循环按预期运行,但随后不会继续。当我在浏览器控制台中运行 querySelectorAll 时,我看到了所有三个不同的项目。

在这里我发现了一个有效的方法:

有效

var nodelist = this.evaluate(function() {
var nodes = document.querySelectorAll('tr.firstrow');
var array = [nodes[0].innerText,nodes[1].innerText,nodes[2].innerText];
return array;
});
this.echo("nodelist.length=" + nodelist.length);
for (var i=0; i<nodelist.length; i++) {
this.echo("i=" + i);
line = nodelist[i];
this.echo("Line: " + line);
}

但这很不方便。

然后我尝试将这个节点列表转换成一个数组。但是这种方法也行不通,因为评估函数的返回值丢失了。

不工作

var nodelist=this.evaluate(function() 
{
console.log("...evaluate()");
var fr_n=document.querySelectorAll('tr.firstrow');
console.log("fr_n.length:" + fr_n.length);

var fr_a=Array.prototype.slice.call(fr_n);

console.log("fr_a.length:" + fr_a.length);
console.log("typeof fr_a:" + typeof fr_a);
console.log("fr_a[0]=" + fr_a[0].innerText);
console.log("fr_a[1]=" + fr_a[1].innerText);
console.log("fr_a[2]=" + fr_a[2].innerText);

return fr_a;

});

this.echo("nodelist.length=" + nodelist.length);

if (Array.isArray(nodelist))
{
this.echo ("nodelist is array");
}
else
{
this.echo ("nodelist is not array");
}

for (var i=0; i<nodelist.length; i++)
{
this.echo("i:" + i);
line = nodelist[i];
this.echo("Line: " + line);
};

产生以下输出:

remote console.log: ...evaluate()
remote console.log: fr_n.length:3
remote console.log: fr_a.length:3
remote console.log: typeof fr_a:object
remote console.log: fr_a[0]=This is the first line I want to see
remote console.log: fr_a[1]=This is the second line I want to see
remote console.log: fr_a[1]=This is the third line I want to see
nodelist.length=0
nodelist is array
[info] [phantom] Done 4 steps in 6943ms

我希望 nodelist.length 是 3 而不是 0。

最佳答案

PhantomJS' page.evaluate()函数是沙盒页面上下文。传递的所有内容都必须进行本质上的字符串化并再次解析。

Note: The arguments and the return value to the evaluate function must be a simple primitive object. The rule of thumb: if it can be serialized via JSON, then it is fine.

Closures, functions, DOM nodes, etc. will not work!

这意味着您无法从页面上下文中获取元素,但您可以在页面上下文中构建它们的表示并将其传递到外部。

您可能需要这些元素的 textContent。您可以使用 CasperJS 函数 getElementsInfo()它为每个元素提供了 text 属性。然后,您可以仅为这一属性过滤信息:

var texts = casper.getElementsInfo('tr.firstrow').map(function(tr){
return tr.text;
});

如果它不是您要查找的文本,则您必须找到另一种表示形式或遍历页面上下文中的 NodeList(在 casper.evaluate() 内)。

关于javascript - 使用 CasperJS 从 querySelectorAll 遍历 NodeList,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28509627/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com