Question

我想计算一下这些div元素的数量，其中包括＆＃39; nice＆＃39;类。我有选择器div.nice，但不知道要使用哪个casperjs类/方法。

事实上有一个tester.assertElementCount方法，但有什么能简单地返回元素的数量吗？

Answer 1

只需

document.querySelectorAll("div.nice").length

Answer 2

如果你可以使用jquery那么简单：

var count = $('div.classname').length;

发现SO Post似乎解释了使用jperery和casperjs，我没有casperjs的经验所以我在那里帮不了多多。

Answer 3

CasperJS 1.1-beta3的一个示例涉及checking the number of Google search results for CasperJS。它引用__utils__.findAll()，它以选择器作为参数。它允许您使用任何JS对象可用的length属性检查返回的项目数：

test.assertEval(function() {
  return __utils__.findAll("h3.r").length >= 10;
}, "google search for \"casperjs\" retrieves 10 or more results");

我从来没有尝试过，但似乎这个实用程序函数可以在条件之外使用，并且它允许您在不使用jQuery的情况下报告元素的数量，如之前的答案所推荐。

Answer 4

你也可以使用 assertElementCount 来断言元素的数量

test.assertElementCount("div.nice", 1)

Answer 5

我没有找到上述答案对我的事业有所帮助。

我认为我的目标是计算元素的数量，而不必在页面上下文中评估js代码，这可能是令人沮丧的超时并且具有冲突的变量和函数。

相反，利用casper自动化上下文会很好。这可以通过＆＃34; .exists（）＆＃34;的组合来完成。和css psuedo-selector＆＃34;：nth-of-type（i）＆＃34;

以下代码执行此操作...

var counter = 1;          //set to one, for css selector setup

casper.then(function() {  //wait your turn
    //loop through our element
    while(casper.exists( 'div span:nth-of-type(' + counter + ')' )) {
        counter++;        //count the results
    }
});

你可以将它变成一个函数并传入所有参数，或者只是将其复制并粘贴为一个步骤。

最好的部分，您可以使用重复声明来关注它，以获得非常酷的循环。

casper.then(function(){
    this.repeat(counter, function() {
        console.log("Another one - item #" + counter);
    });
});

phantomjs / casperjs计算DOM元素

5 个答案: