Assume you have a structure of commented html, that comes from server (it's commented for improve rendering speed, like FB). After that we should remove our content and allow browser render html. What is the quickest way to do this?
6
-
This might help: stackoverflow.com/questions/5653207/…MassivePenguin– MassivePenguin2012-09-18 07:54:37 +00:00Commented Sep 18, 2012 at 7:54
-
thanks, I've seen it before, and even implement something like that, but I've researching the quickest way.ValeriiVasin– ValeriiVasin2012-09-18 07:56:05 +00:00Commented Sep 18, 2012 at 7:56
-
1Using pure JS will be faster than using jQuery.MassivePenguin– MassivePenguin2012-09-18 07:58:31 +00:00Commented Sep 18, 2012 at 7:58
-
yep, i'm just researching ways. Could we remove just comment node and replace it with it's content.ValeriiVasin– ValeriiVasin2012-09-18 08:04:57 +00:00Commented Sep 18, 2012 at 8:04
-
Right, sorry, I misunderstood - I thought you were trying to remove the comments (and their content) from the DOM. If you're just removing the '<!--' and '-->' tags then your best bet might be the uncomment plugin, as posted by bart sMassivePenguin– MassivePenguin2012-09-18 08:07:20 +00:00Commented Sep 18, 2012 at 8:07
|
Show 1 more comment
7 Answers
Probably using jquery uncomment plugin
1 Comment
ValeriiVasin
seems like it's not optimized :) but idea with
nodeType === 8 is okyou can use the "content()" method to cet all nodes including comments: light and plugin free !!
Then you should filter the collection using "filter()" method
$container
.contents()
.filter(function(){ return this.nodeType == 8; })
.remove(); // replaceWith() etc.
1 Comment
WoodrowShigeru
Note that
.contents() doesn't seek deep.
function _removeComments(node) {
if (!node || !node.parentNode) return;
if (node.nodeType == 8) {
node.parentNode.removeChild(node);
return;
}
for (var c = node.firstChild; c; ) {
var n = c.nextSibling;
_removeComments(c);
c = n;
}
}
function removeComments(element) {
element.each(function() {
_removeComments(this);
});
}
Comments
well get the commented DOM then do a replace()
var dom = $.trim($('#domcontainer').html()).replace('<!--','').replace('-->','');
1 Comment
ValeriiVasin
I'm using
.replace(/<!--([\s\S]*?)-->/mig, '$1');$(stringHtml).comments().remove();
...using the jquery-comments plugin:
2 Comments
FirstVertex
Uncaught TypeError: $(...).comments is not a function
chovy
Try this method. Provide the element node with the commented HTML and this will remove the comment blocks and reveal the HTML.
function uncommentNode(node) {
var nodestr = node.innerHTML;
var noderevealHTML = nodestr.replace(/<!--/ig, '').replace(/-->/ig, ''); // Update expressions here.
node.innerHTML = noderevealHTML;
}
If your commented HTML has three or more dashes (<-- / <---) in the comment start/end tag, be sure to update the replace() expressions in the function above.
Here's a JSFIDDLE for better explanation.
Comments
Finding them with document.querySelectorAll() is impossible. And jQuery.contents() doesn't seek deep.
But this short logic collects all comments – even those nested deep.
let gatherer = (root) => {
return gatherer_rec(root).flat(Infinity);
};
let gatherer_rec = (node) => {
if (!(node instanceof Node)) {
return [];
}
if (node.nodeType === Node.COMMENT_NODE) {
return [node];
}
return Array.from(node.childNodes).map((item) => gatherer_rec(item));
};
Once you have a specific comment, you can totally use jQuery methods for the replacement.
$(gatherer(document.body)[54]).replaceWith('hi');
Adjust to your needs.
Comments
