Вот решение для точного соответствия элемента.
Важно понимать, что селектор ( не является реальным ), которые показывают хром-инструменты, однозначно не идентифицируют элемент в DOM. (, например, он не будет различать список последовательных элементов span
. Нет информации о позиционировании / индексировании )
Адаптация из аналогична (о xpath ) answer
$.fn.fullSelector = function () {
var path = this.parents().addBack();
var quickCss = path.get().map(function (item) {
var self = $(item),
id = item.id ? '#' + item.id : '',
clss = item.classList.length ? item.classList.toString().split(' ').map(function (c) {
return '.' + c;
}).join('') : '',
name = item.nodeName.toLowerCase(),
index = self.siblings(name).length ? ':nth-child(' + (self.index() + 1) + ')' : '';
if (name === 'html' || name === 'body') {
return name;
}
return name + index + id + clss;
}).join(' > ');
return quickCss;
};
И вы можете использовать его так:
console.log( $('some-selector').fullSelector() );