Я хотел бы извлечь текст из элемента DOM с помощью пользовательского селектора jQuery. Он должен выбирать только текстовый узел без его помеченных братьев и сестер (очень похоже на /text() в XPath).
Предыстория: я работаю над расширением Firefox, которое извлекает определенную информацию (например, имя пользователя) на самых разных веб-сайтах. Теперь я хочу, чтобы мои пользователи могли динамически добавлять определения пути для новых веб-сайтов через максимально простую форму:
Добавить новый сайт:
URL: ________________ (например, "http://stackoverflow.com/questions/")
Путь: ________________ (например, ".user-details>a:eq(0)" для имени пользователя, задавшего вопрос)
Например, в stackoverflow $(path).text() вернет имя пользователя в виде текста. Но на некоторых других сайтах имя пользователя доступно только как текстовый узел с помеченными братьями и сестрами, как в этом примере:
<div id="person">
johndoe <span id="age">(57)</span>
<span id="description">Lorem ipsum dolor sit amet…</span>
</div>
Поскольку jQuery не предоставляет селектора для текстовых узлов (например, /text() в XPath), я надеялся найти решение, создающее собственный селектор.
Я знаю, как получить текстовый узел без селектора:
var textNode = $('#person').contents().filter(function(){
return this.nodeType == 3;
}).text();
alert(textNode); // gives me "johndoe"
Как бы я перевел это в пользовательский селектор? Следующее, очевидно, не работает, поскольку оно всегда возвращает полный элемент, как только одна его часть является текстовым узлом (как объясняет @VinayC в своем ответе):
$.extend($.expr[':'],{
getText: function(element){
return $(element).contents().filter(function() {return this.nodeType == 3;}).text();
}
});
alert($('#person:getText')); //returns the whole DIV element
См. мой jsfiddle
Возможно, это невозможно сделать с помощью пользовательских селекторов jQuery. Вот почему я думаю о том, чтобы вернуться к XPath, который кажется более универсальным.
Спасибо за вашу помощь.