Получить каждый элемент с определенным атрибутом (data-) в CasperJS

Я пытаюсь протестировать страницу с помощью CasperJS. Есть ли какие-либо возможности получить каждый элемент (абзацы), который содержит атрибутивные данные -...? После этого мне нужно сравнить этот атрибут с внутренним HTML, но я не знаю, как это сделать.

1 2
javascript html custom-data-attribute casperjs

1 ответ:

Сначала вам нужно получить представления всех интересующих вас элементов. Это можно сделать с помощью casper.getElementsInfo(selector):

var elements = casper.getElementsInfo("p[data-whatever]");
Это даст вам все элементы <p> на странице, которые имеют набор атрибутов data-whatever. Если вы хотите отфильтровать его по значениям атрибутов data-whatever, то вам нужно использовать селекторы атрибутов в соответствии с вашими потребностями.

Функция getElementsInfo() содержит очень много полезной информации, но не содержит фактических элементов то, что вы хотите использовать. Он содержит только представление в виде массива.

Вы можете перебирать эти представления элементов и выполнять над ними свои операции. Вы сказали, что хотите "сравнить этот атрибут с внутренним HTML" . Это можно сделать следующим образом: 

elements.forEach(function(element){
    if (element.attributes["data-whatever"] === element.html) {
        casper.echo("data attribute and content are exactly equal");
    } else {
        casper.echo("data attribute and content are different");
    }
});

Имейте в виду, что вы можете сделать это на элементах непосредственно с помощью обычных функций DOM, но тогда вам придется сделать это внутри casper.evaluate(), потому что PhantomJS (на котором построен CasperJS) имеет два контекста и контекст страницы изолирован. Кроме того, вы не можете вернуть узлы DOM из контекста страницы .

5