Geek Answers Handbook

Can you use jquery to dynamically add comments to code?

I tried:

<script> $(function() { $('.class').before('<!--'); $('.class').after('-->'); }); </script>

but it didn’t work for a reason unknown to me.

Can someone help me understand why this did not work and how will I do it? Thank you very much appreciated.

+6
jquery html
source share
9 answers

It looks like you are trying to delete objects with .class . Use .hide() . Comments are only processed if the browser first loads the page, so adding comments will not comment on anything.

You need to know the difference between HTML and DOM. HTML is a textual representation of a page, but the browser parses it in the DOM when the page loads. JavaScript works on the DOM, not HTML. Using .innerHtml() in DOM elements renders HTML.

Here is an example of using innerHtml() to hide elements using HTML comments (but note that I will never do this - I'm only showing how to do what looked like what you were trying to do in your question):

HTML:

 <h1>hello</h1> <div> <p>wow</p> <p>dude</p> </div>​

JavaScript (+ jQuery):

 $(document).ready(function () { setTimeout(hideIt, 1000); }); function hideIt() { $('div').html('<!--' + $('div').html() + '-->'); }​
+7
source share

You mix two completely unrelated concepts: HTML and DOM.

HTML is a textual description tool for content, which - like code - has commenting facilities. The DOM is the resulting object model in the browser.

After the HTML has been read and parsed and the DOM has been created, the HTML is discarded and not required. Adding HTML comments to things will not change them and it doesn’t really make sense (although it’s easy to see how you thought it would be, make no mistake).

Once you have the DOM, to hide the element without deleting it, use hide . To completely remove it, use remove .

Live examples of both: http://jsbin.com/araju

+4
source share
 $("<!--your comment text here -->").insertAfter(selector);

or

 $(selector).after("<!--your comment text here -->");

live demonstration

+2
source share

No, you cannot add start and end commend tags like this. The comment tag is a single tag; it is not a separate start tag and end tag. Thus, <!-- and --> are not valid HTML snippets since they do not contain complete tags.

If you want to put an element in a comment, it is no longer an element, so for this you will need to get the HTML code for the element, put a comment around it and replace the element with a comment.

If you do this to hide an element, you should simply use the hide method.

+1
source share

I think you will need to add and add to make it the way you think. Not sure if that would really make things disappear.

If you want something not to be visible, it is best to use hide ().

0
source share

Using .hide () is the best way to achieve what you want. It's also worth mentioning that comment objects are part of the DOM, so theoretically you can manipulate them (or add new ones) using jQuery.

0
source share

Some options:

 $('.mycurrentclass').remove(); $('.mycurrentclass').detach();// see below for possible use $('.mycurrentclass').css({display:'none'}); $('.mycurrentclass').hide(); $('.mycurrentclass').toggleClass('myhiddenclass'); $('.mycurrentclass').addClass("myhiddenclass"); $("myselector").toggle( function () { $(this).addClass("myhiddenclass"); }, function () { $(this).removeClass("myhiddenclass"); } ); // programtic like you seem to want:(first part puts it back, else detaches it) var p; if ( p ) { p.appendTo("mywheretoappenditselector"); p = null; } else { p = $("myselector").detach(); };
0
source share

To provide a more direct answer, use:

 var gonee = $('.myclass'); $('.myclass').replaceWith('<!--' + gonee + '-->');

see me in action: http://jsfiddle.net/YNe6w/1/

0
source share

Pls use .html () to dynamically add html content

eg:

  $(.dv).click(function(){ $(".dy").html("abcd"); }); <div class=".dy" > </div>

try it and hope it works for you

0
source share

More articles:


All Articles