XPATH для выбора div после выбора вложенного элемента?

Я хотел создать общий идентификатор, чтобы найти раскрывающийся список после метки. У меня есть 10 разных форм с одинаковым форматом, но с разными идентификаторами, именами и т. д., поэтому я не могу их использовать. Вместо этого я искал метку над раскрывающимся списком, а затем выбирал следующий div после того, который содержит раскрывающийся список.

Идея состоит в том, чтобы выбрать раскрывающийся список после нахождения метки с надписью «Заголовок».

Я пробовал несколько разных XPath. Попытка что-то вроде этого:

//span[text()='Title']/following-sibling::div[@class='col-xs-12 form-field input_controls ']

РЕДАКТИРОВАТЬ ** Код здесь:

<div class = "form-group is-required sc-row sc-row-12"><div id = "label_IO:d027ec571b332450c82599361a4bcbb2" class = "" nowrap = "true" type = "18" oncontextmenu = "return contextQuestionLabel(event, 'd027ec571b332450c82599361a4bcbb2', '18');"><label for = "IO:d027ec571b332450c82599361a4bcbb2" class = "col-xs-12 control-label"><span id = "status.IO:d027ec571b332450c82599361a4bcbb2" title = "Mandatory - must be populated before Submit" mandatory = "true" oclass = "" class = " required-marker" data-original-title = "Mandatory - must be populated before Submit">&nbsp;</span><img src = "images/s.gifx" style = "width:1px; margin-right:0px; margin-left:0px" id = "section508.IO:d027ec571b332450c82599361a4bcbb2" alt = "Mandatory - must be populated before Submit" title = "Mandatory - must be populated before Submit" data-original-title = "Mandatory - must be populated before Submit"><span class = "sn-tooltip-basic " data-toggle = "tooltip" data-placement = "auto" title = "Title" data-original-title = "Title">Title</span></label></div><div class = "col-xs-12 form-field input_controls "><select name = "IO:d027ec571b332450c82599361a4bcbb2" id = "IO:d027ec571b332450c82599361a4bcbb2" class = "form-control cat_item_option " onchange = "if (typeof(variableOnChange) == 'function') variableOnChange('IO:d027ec571b332450c82599361a4bcbb2')"><option value = "" selected = "SELECTED" role = "option">-- None --</option><option value = "b30330019f22120047a2d126c42e70ff" role = "option">Chief Executive Officer</option><option value = "f30330019f22120047a2d126c42e70ff" role = "option">Chief Financial Officer</option><option value = "370330019f22120047a2d126c42e70ff" role = "option">Chief Technology Officer</option><option value = "770330019f22120047a2d126c42e70ff" role = "option">Director of Application Development</option><option value = "b70330019f22120047a2d126c42e70ff" role = "option">Director of Infrastructure</option><option value = "f70330019f22120047a2d126c42e70ff" role = "option">Director of Procurement</option><option value = "3b0330019f22120047a2d126c42e70ff" role = "option">Director of Security</option><option value = "7b0330019f22120047a2d126c42e70ff" role = "option">Director, Audit &amp; Risk</option><option value = "bb0330019f22120047a2d126c42e70ff" role = "option">Director, Finance Strategy</option><option value = "fb0330019f22120047a2d126c42e70ff" role = "option">HR Administrator</option><option value = "3f0330019f22120047a2d126c42e70ff" role = "option">HR Manager</option><option value = "7f0330019f22120047a2d126c42e70ff" role = "option">Infrastructure Analyst</option><option value = "bf0330019f22120047a2d126c42e70ff" role = "option">Procurement Administrator</option><option value = "ff0330019f22120047a2d126c42e70ff" role = "option">Recruitment Administrator</option><option value = "330370019f22120047a2d126c42e7000" role = "option">Recruitment Manager</option><option value = "730370019f22120047a2d126c42e7000" role = "option">Security Analyst</option><option value = "b30370019f22120047a2d126c42e7000" role = "option">Senior Auditor</option><option value = "f30370019f22120047a2d126c42e7000" role = "option">Senior Developer</option><option value = "370370019f22120047a2d126c42e7000" role = "option">Senior Finance Analyst</option><option value = "770370019f22120047a2d126c42e7000" role = "option">SVP, Human Resources</option></select><input type = "HIDDEN" class = "cat_item_option" name = "sys_original.IO:d027ec571b332450c82599361a4bcbb2" id = "sys_original.IO:d027ec571b332450c82599361a4bcbb2" value = ""></div></div>

Пожалуйста, поделитесь кодом, чтобы мы могли воспроизвести проблему.

— 25.04.2023 12:13

Делитесь HTML в виде текста, а не изображения.

— 25.04.2023 12:40

Как сказано, предоставьте достаточно кода, чтобы другие могли лучше понять или воспроизвести проблему.

— 25.04.2023 13:12

Я удалил изображение кода и добавил html в редактирование

— 25.04.2023 14:52

javascript html css selenium-webdriver css-selectors

25.04.2023 12:11

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Похоже, что XPath будет чем-то вроде "../../div[2]/select", и с помощью функции из этого ответа вы можете найти свой выбор с ним.

При этом ярлык должен иметь атрибут for, который вы сможете использовать.

const origin = document.querySelector("label");

const targetByWalk = origin.parentElement.parentElement.querySelector("select");
console.info("targetByWalk", targetByWalk);

const targetByForProperty = document.getElementById(origin.getAttribute("for"));
console.info("targetByForProperty", targetByForProperty);

// https://stackoverflow.com/a/14284815/17519505
function getElementByXpath(path, origin = document) {
  return document.evaluate(
    path,
    origin,
    null,
    XPathResult.FIRST_ORDERED_NODE_TYPE,
    null
  ).singleNodeValue;
}
const targetByXPath = getElementByXpath("../../div[2]/select", origin);
console.info("targetByXPath", targetByXPath);

<div>
  <div>
    <label for = "some-id">Choose a fruit</label>
  </div>
  <div>
    <select id = "some-id">
      <option>apple</option>
      <option>banana</option>
    </select>
    <p id = "a-similar-id"><i>blah blah</i></p>
  </div>
</div>

25.04.2023 12:47

Ответ принят как подходящий

«Идея состоит в том, чтобы выбрать раскрывающийся список после нахождения ярлыка с заголовком»

Чтобы достичь вышеизложенного, используйте приведенное ниже выражение XPATH:

//span[text()='Title']//following::select[1]

Выше выражение XPATH найдет первый узел <select>, который появляется после узла с текстом «Заголовок».

25.04.2023 15:02

Другие вопросы по теме

Как предотвратить переполнение с помощью flex в псевдоэлемент

Как добавить и отслеживать счет в Dice Game

React JS: почему функция стрелки не нужна для обработчика событий отправки

Как снять другие флажки, когда один отмечен?

Отключить кнопки на 2 секунды в HTML

Ошибка синтаксиса PHP, повторяющая таблицу HTML с PHP в ней

Как работает разблокировщик CORS со стороны клиента?

Получить данные отправки формы из переключателей, сгенерированных массивом 2d

Как лучше всего пометить список связанных сообщений в HTML5?

Как смешать один и тот же цвет из div и ::after? (предотвратить смешивание)

XPATH для выбора div после выбора вложенного элемента?

Ответы 2

Другие вопросы по теме

Похожие вопросы