В дебрях html есть некий элемент:
<body>
...
<table>
<tbody id="parent-1" class="parent-node">
<tr id="child-1" class="child-node">
<td class="title-text">
Тюльпан
</td>
</tr>
</tbody>
/* другие аналогичные древа элементов, число и содержимое которых может быть разным */
</table>
...
<body>function hideByTitle() {
var __t = this;
this.input = document.CreateElement('input')
this.input.type = 'text'
this.input.id = 'hide-by-title-text'
this.input.placeholder = 'Чемодан, Чебуреки, Чебоксары'
this.input.addEventListener('focusout', function(e) {
var keywords = __t.input.value.split(', ');
/*
...
*/
}, false)
}Можно собирать все элементы .title-text, и проверять их содержимое через `.indexOf >= 0` или регулярными выражениями, потом возвращиться на два родителя выше и добалять `.style['display'] = 'none'` или просто какой нибудь скрывающий класс. Но это же харам какой то будет - элементов может быть очень много, ключевых слов тоже, и ведь все это надо запускать только после того как страница будет полностью загружена.
Здорово было бы если бы CSS позволял делать что нибудь подобное
td.title-text[text*="Тюльпан"]::parent()::parent() { display:none!important; }Почитал немного про XPatch и ... ничего не понял правильно ли я понимаю как он работает? Позволит ли реализовать то что мне нужно?
function getElementByXpath(path, value) {
var TYPE;
switch (value) {
case 9: TYPE = 'FIRST_ORDERED_NODE_TYPE'; break;
case 8: TYPE = 'ANY_UNORDERED_NODE_TYPE'; break;
case 7: TYPE = 'ORDERED_NODE_SNAPSHOT_TYPE'; break;
case 6: TYPE = 'UNORDERED_NODE_SNAPSHOT_TYPE'; break;
case 5: TYPE = 'ORDERED_NODE_ITERATOR_TYPE'; break;
case 4: TYPE = 'UNORDERED_NODE_ITERATOR_TYPE'; break;
case 3: TYPE = 'BOOLEAN_TYPE'; break;
case 2: TYPE = 'STRING_TYPE'; break;
case 1: TYPE = 'NUMBER_TYPE'; break;
default:TYPE = 'ANY_TYPE';
}
return document.evaluate(path, document.body, null, XPathResult[TYPE], null);
}
console.log(getElementByXpath('//td[@class="title-text"][text()="Тюльпан"]', 8))
вот оно возвращает какой то объект с одной нодой (с самой первой которую нашел)
XPathResult { resultType: 8, singleNodeValue: <td.title-text>, invalidIteratorState: false }//td[@class="title-text"][text()="Тюльпан"]::parent::parent:css(display:none)Просто я много раз натыкался на сравнение XPatch и CSS, не просто же так в самом деле - значит при помощи них делают примерно одно и то же (как мне подумалось)
Сами мы в XPatch ни в зуб ногой, подайте советов мудрых люди добрые, кто сколько может (в интернетах примеры очень пресные и описывают в основном брождение по элементам xml, а что и как при помощи него делают я так и не понял)
