Как создать Xpath элемента, по которому щелкнули, используя Javascript или Jquery? - PullRequest
Новая
       1

Как создать Xpath элемента, по которому щелкнули, используя Javascript или Jquery?

0 голосов
/ 14 ноября 2018

У меня есть веб-страница, на которой я связываю событие click с элементом.Когда пользователь нажимает на конкретный элемент.Я хочу получить XPath элемента, начиная с HTML или тела тега.т. е. "Абсолютный Xpath"

Предположим, что в приведенном ниже примере html я щелкаю на интервале с текстом "USA", поэтому Absolute Xpath будет 

/html[1]/body[1]/div[2]/div[1]/div[1]/span[1]

<html>
    <body>
        <div class="header">Countries</div>
        <div class="row">
            <div class="row_in">
                <div class="row_in_in">
                    <span>India</span>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="row_in">
                <div class="row_in_in">
                    <span>USA</span>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="row_in">
                <div class="row_in_in">
                    <span>UK</span>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="row_in">
                <div class="row_in_in">
                    <span>France</span>
                </div>
            </div>
        </div>
    </body>
</html>

Есть ли у нас какая-либо библиотека, где она может помочь мне сгенерировать XPath, где я передаю элемент Dom, и он может сгенерировать его?

Я сталкивался с несколькими библиотеками, но они помогают определять содержимое внутри html на основе предоставленного Xpath.

1 Ответ

0 голосов
/ 14 ноября 2018

Для выполнения этой работы вам нужно перебрать элемент, по которому щелкнули, и его родителей Таким образом, вы можете вызвать функцию, вложенную для выполнения этой работы. 

var xpath;
$("*").click(function(e){
  xpath = '';
  addXpath($(this));
  console.log(xpath);
  e.stopPropagation();
});

function addXpath($ele){
  var tagName = $ele[0].tagName.toLowerCase();
  var index = $ele.parent().children(tagName).index($ele)+1;
  xpath = '/'+tagName +'['+index+']'+ xpath;
  !$ele.parent().is(document) ? addXpath($ele.parent()) : "";
}
body {background: green}
.header {background: orange}
.row_in {background: yellow}
.row_in_in {background: blue}
span {background: red}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="header">Countries</div>
<div class="row">
<div class="row_in">
  <div class="row_in_in">
    <span>India</span>
  </div>
</div>
</div>
<div class="row">
<div class="row_in">
  <div class="row_in_in">
    <span>USA</span>
  </div>
</div>
</div>
<div class="row">
<div class="row_in">
  <div class="row_in_in">
    <span>UK</span>
  </div>
</div>
</div>
<div class="row">
<div class="row_in">
  <div class="row_in_in">
    <span>France</span>
  </div>
</div>
</div>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...