Пользовательский скрипт Javascript - поиск и замена: текстовые узлы и HTML
Я пытаюсь создать пользовательский скрипт (Tampermonkey), чтобы добавить несколько вспомогательных кнопок на сайт, и изначально я использовал скрипт ниже, основанный на опубликованном здесь.
setInterval(function() {
//RegEx for finding any string of digits after "ID: " up to the next space
var myRegexp = /ID:\s(\d*?)\s/gi;
];
var txtWalker = document.createTreeWalker (
document.body,
NodeFilter.SHOW_TEXT,
{ acceptNode: function (node) {
//-- Skip whitespace-only nodes
if (node.nodeValue.trim() )
return NodeFilter.FILTER_ACCEPT;
return NodeFilter.FILTER_SKIP;
}
},
false
);
var txtNode = null;
while (txtNode = txtWalker.nextNode () ) {
var oldTxt = txtNode.nodeValue;
//Find all instances
match = myRegexp.exec(oldTxt);
while (match != null) {
//Get group from match
var idNum = match[1]
//Replace current match with added info
oldTxt = oldTxt.(idNum, idNum+"| <SomeHTMLHere> "+idNum+" | ");
//Update text
txtNode.nodeValue = oldTxt;
//Check for remaining matches
match = myRegexp.exec(oldTxt);
}
}
}, 5000);
Теперь я хотел бы добавить немного больше функциональности к тексту, возможно, что-то кликабельное, чтобы скопировать в буфер обмена или вставить в другое место. Теперь я знаю, что работаю с текстовыми узлами в исходном скрипте, но я хотел знать, можно ли каким-либо образом адаптировать текущий скрипт для вставки HTML в этих точках без перезаписи с нуля.
Основная проблема с сайтом - это ID: ##### значения, которые я ищу, все отображаются в одном элементе, как показано ниже, поэтому я мог просто найти их по элементам (или, по крайней мере, не с моими ограниченными знаниями JS).
<div>
ID: 1234567 | Text
ID: 45678 | Text
</div>
Было бы здорово, если бы кто-то указал мне правильное направление или хотя бы сказал, что это невозможно без переписывания.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Хорошо, так что переписывание действительно неплохо сработало. Работает намного лучше и лаконичнее. Надеюсь, это поможет кому-то в будущем. Если кто-то хочет предложить что-то улучшенное, пожалуйста, не стесняйтесь!
setInterval(function() {
//Regex
var reg = /ID:\s(\d*?)\s/gi;
var result;
//Get all classes that this applies to
$('.<parentClass>').each(function(i, obj) {
var text = $(this).html();
//Do until regex can't be found anymore
while (result = reg.exec(text)) {
//Get first regex group
var str = result[1];
//Add in desired HTML
var newhtml = $(this).html().replace(str, '|<span class = "marked">' + str + '</span>|');
//Replace
$(this).html(newhtml);
}
});
//Click function for added HTML
$(".marked").click(function(){
//Get text inside added HTML
var id = $(this).text();
//Construct desired string
var Str = "someText " + id;
//Insert into message box
textarea = document.querySelector('.<inputArea>')
textarea.value = Str;
textarea.focus();
});
}, 5000);