my HTML code :
<body>Firebrand will tend to burn any bricks out there. so the best idea is to ignore any active firebrand if you are a bricks. Otherwise, you can challenge a firebrand if you have the proper quality to keep up with their latest technology. And don't mess up with firebrand if you are a robber.</body>
I want to find any "firebrand" inside the body and replace it with <span class="firebrand">firebrand</span> with jQuery
Just recurse through the DOM, while using:
.replace(/(firebrand)/gi, '<span class="firebrand">$1</span>')
on each text content.
function firebrand($el) {
$el.contents().each(function () {
if (this.nodeType == 3) { // Text only
$(this).replaceWith($(this).text()
.replace(/(firebrand)/gi, '<span class="firebrand">$1</span>'));
} else { // Child element
firebrand($(this));
}
});
}
firebrand($("body"));
Try out the following.
var textApply;
textApply = function(node){
jQuery.map($(node), function(node) {
var value = $(node)[0];
if (value.nodeType == 3 && value.textContent.match(/firebrand/gi)) {
var foo = value.textContent.replace(/[\n\r\t ]+/,' ').replace(/firebrand/gi, '<span style="color:red">Firebrand</span>');
var newitem = $(foo);
$(node).replaceWith(newitem);
} else if (value.nodeName != 'SCRIPT') {
jQuery.map($(node).contents(), textApply);
}
});
};
textApply($('body'));
来源：https://stackoverflow.com/questions/1788939/jquery-find-and-wrap-textnode-with-some-element