Как мне найти надежный XPath для этого html-элемента (тип - текст, класс известен, идентификатор отсутствует)?

#html #google-chrome #xpath #phantomjs #casperjs

#HTML #google-chrome #xpath — путь #phantomjs #casperjs #xpath

Вопрос:

Элемент похож на:

<input type="text" class="information">

Для элемента нет идентификатора. Внутри text класса есть только один information элемент type. Я хочу иметь возможность вводить текст в этот html-элемент, используя casperjs который работает поверх phantomjs .

XPath, полученный с помощью chrome developer tools, похож на:

 //*[@id="abcid"]/div/div[1]/input

abcdid — это идентификатор элемента div, который состоит из текстового поля и нескольких других элементов. Но мне нужен более надежный XPath. Я не очень опытен в поиске XPaths, поэтому простите меня, если ответ слишком очевиден.

1. Вы действительно использовали утилиту XPath casperjs? var x = require('casper').selectXPath; x('//*[@id="abcid"]/div/div[1]/input') . Почему бы просто не использовать CSS-селектор: input.information[type='text']

2. @ArtjomB. Ошибка «элемент не найден» была вызвана тем, что не была импортирована утилита xpath casperjs. Я понял это достаточно скоро, но не обновил вопрос, потому что мне нужен был более надежный XPath, чтобы небольшие изменения в html не потребовали от меня повторного изменения xpath. Я думаю, CSS-селектор был бы хорош. Я сейчас их читаю. Думаю, все пойдет именно так, особенно если они имеют аналогичную структуру, как в вашем комментарии. Спасибо!

Ответ №1:

Если вы хотите использовать селекторы XPath почти для всех функций CasperJS, вам нужно предоставить его как объект. Если селектор предоставлен в виде строки, автоматически предполагается, что это селектор CSS.

Вы можете создать объект выбора XPath самостоятельно:

 {
    type: 'xpath',
    path: '//input[@class="information"]'
}

или просто воспользуйтесь утилитой XPath, сначала запросив ее в начале вашего скрипта, а затем используя ее:

 var x = require('casper').selectXPath;
// later ...
var text = casper.fetchText(x('//input[@class="information"]'));

Что касается вашего селектора:

Если существует только один, input с information классом, вы можете использовать XPath

 //input[@class="information"]

или селектор CSS

 input.information[type='text']

Если во входных данных есть и другие классы, селектор CSS будет работать как есть, но селектор XPath должен быть изменен на

 //input[contains(@class,"information")]

1. Спасибо. У меня есть один последующий вопрос: если я хочу указать более одного класса и другие вещи, такие как text (). Могу ли я добавить их все в квадратные скобки? Например: //p[contains(@class,"class1"),contains(@class,"class2"),contains(text(),"abc")] .

2. Да, но с немного другим синтаксисом: //p[contains(@class,"class1") and contains(@class,"class2") and contains(text(),"abc")]‌ . Имейте в виду, что text() возвращает только текстовые узлы текущего элемента (в данном случае текст непосредственно внутри p ). Если вам нужен любой текст, независимо от глубины, вы можете сделать //p[contains(.,"abc")]‌