Создайте выражение XPath программно

Question

Можно ли автоматически генерировать наиболее конкретное выражение XPath из позиции курсора на веб-странице?Выражение XPath изменится с «событием onMouseMove».

Если это возможно, как бы вы это реализовали?Или это уже реализовано в какой-то библиотеке Javascript или Python?Я бы предпочел это в Python с комбинацией некоторой веб-библиотеки, но Javascript было бы хорошо и приемлемо.

Answer 1

Я ответил на почти идентичный вопрос ( с использованием jQuery ) на Вернуть местоположение XPath с помощью jQuery?Нужна обратная связь по функции

Если вы измените событие click на mouseenter, у вас будет то, что вы просите.

$(document).delegate('*','mouseenter',function(){
    var path = $(this).parents().andSelf();
    var xpath='/';
    for (var i = 0; i < path.length; i++)
    {
        var nd = path[i].nodeName.toLowerCase();
        xpath += '/';
        if (nd != 'html' && nd != 'body')
        {
            xpath += nd;
            if (path[i].id != '')
            {
                xpath += '#' + path[i].id;
            }
            else
            {
                xpath += '['+ ($(path[i-1]).children().index(path[i])+1) +']';
            }
            if (path[i].className != '')
                xpath += '.' + path[i].className;
        }
        else
        {xpath += nd;}                    
    }
    $('#xpath').html(xpath); // show the xpath in an element with id xpath..
    return false;
});

Демонстрация на http://jsfiddle.net/gaby/hsv97/25/

---

Обновление без использования jQuery .. ( для современных браузеров )

function getXpath(event){
    var hierarchy = [],
        current = event.srcElement||event.originalTarget;
    while (current.parentNode){
        hierarchy.unshift(current);
        current = current.parentNode;
    }
    var xPath = hierarchy.map(function(el,i){
            return el.nodeName.toLowerCase() + ((el.id !== '') ? '#'+el.id : '') + ((el.className !== '') ? '.'+el.className.split(' ').join('.') : '');
        }).join('/');
    document.getElementById('xpath').innerHTML = xPath;
    return xPath;
}

if (document.addEventListener){
    document.addEventListener('mouseover', getXpath, false);
} else {
    document.onmouseover = getXpath;
}

Демо в http://jsfiddle.net/gaby/hsv97/29/

Answer 2

См. Ветку Get XPath в DZone Snippets для поиска XPath.См. Как я могу проверить, находится ли мышь над элементом в jQuery? здесь вопрос для определения, когда курсор мыши находится над элементом.

Answer 3

ванильный JavaScript (с индексами) http://jsfiddle.net/nycu2/1/

function nodeindex(element, array) {
    var i,
        found = -1,
        element_name = element.nodeName.toLowerCase(),
        matched
       ;

    for (i = 0; i != array.length; ++i) {
        matched = array[i];
        if (matched.nodeName.toLowerCase() === element_name) {
            ++found;


        if (matched === element) {
            return found;
        }
        }
    }

    return -1;
}

function xpath(element, suffix) {
    var parent, child_index, node_name;

    parent = element.parentElement;

    if (parent) {
        node_name = element.nodeName.toLowerCase();
        child_index = nodeindex(element, parent.children) + 1;
        return xpath(parent, '/' + node_name + '[' + child_index + ']' + suffix);
    } else {
        return '//html[1]' + suffix;
    }
}

function xpathstring(event) {
    var
    e = event.srcElement || event.originalTarget,
        path = xpath(e, '');;

    document.querySelector('.xpathresult').value = path;

    highlight();
}