Commenting Out Large Section that Includes Comments

[daveg7]

I wish that XHTML and CSS would have a quick way to comment out a large section that includes a lot of other comments. That would save me a lot of time.

For example, I could do something like this in HTML (I’m making up some syntax):

<~-- Everything after this is included, included the comments

[INDENT][INDENT]Plenty of stuff here, including sections with comments[/INDENT][/INDENT]

–~>

Right now, the fastest way that comes to mind is to automatically replace, within the body of markup, all instances of “–>” with something like “XXX>”. Then I’d just use the usual <!-- and –> at the beginning and end of the entire section.

Any ideas?

:stir:

Thanks,

Dave

[Stevie_D]

@daveg7

I wish that XHTML and CSS would have a quick way to comment out a large section that includes a lot of other comments. That would save me a lot of time.

For example, I could do something like this in HTML (I’m making up some syntax):

<~-- Everything after this is included, included the comments

[INDENT][INDENT]Plenty of stuff here, including sections with comments[/INDENT][/INDENT]

–~>

Right now, the fastest way that comes to mind is to automatically replace, within the body of markup, all instances of “–>” with something like “XXX>”. Then I’d just use the usual <!-- and –> at the beginning and end of the entire section.

Any ideas?

I can’t see any easier way of doing it than with a search-and-replace - just make sure you re-replace it when you un-comment it!

[r937]

@daveg7

Any ideas?

delete the chunks that you’re trying to comment out

blah blah blah

<!-- chunk1.txt removed 2010-09-09 -->

blah-de-blah-blah

<!-- chunk2.txt removed 2010-09-09 -->

blah blah woof woof

when you’re ready, you can just copy/paste them back in

simple? you betcha!!

effective? oh yeah!!

[Ed_Seedhouse]

Using many comments in your html is generally a bad practice anyway, HTML is a semantic language and when well written it pretty well documents itself, as indeed it is designed to do. If you find yourself needing a lot of comments then almost certainly you are taking the wrong approach to coding in the first place.

[Stevie_D]

@Ed_Seedhouse

Using many comments in your html is generally a bad practice anyway, HTML is a semantic language and when well written it pretty well documents itself, as indeed it is designed to do. If you find yourself needing a lot of comments then almost certainly you are taking the wrong approach to coding in the first place.

Very true. I tend to use comments to note which layout <div> I’m closing, just to make sure I end up with them all closed, but I rarely use them to comment the HTML apart from that.

What I do use comments a lot for is temporarily hiding a section of content. This might be something that is only applicable at certain periods, or it might be something that isn’t working quite right and I want to be left off until it’s fixed, or any number of other reasons. I know this probably isn’t a “best practice” use of comments, but it is effective and does the job. The only time it has the potential for confusion is when the section I want to hide contains either comments or includes, but apart from that it works a treat.

[system]

any ideas? yeah, look for this automated feature in a text IDE or some other html editor applications. or replace –> with ->. and your problem is not really one with xhtml or css only. there are scenarios when even in other languages, take java for example, you have the same issues: when nesting multiple lines comments.

you need to remember, that unlike in some other languages, comments in html are actual elements, they are in the form of a tag. while commenting may be a feature greatly missed in those other languages, html is designed for text transportation and there is no logic reason to bulk it with useless extra luggage.

but you may also have a point there, as when it comes to CSS or JS this commenting feature is not that restrictive. but i guess that an html DOM is simple enough so it’s something that makes perfect sense on its self, as opposed to a CSS or, even more, a JS code. plus, id and class attributes also help big time. thus no one saw fit to propose a better way of commenting, not even in html5. also, the backward compatibility would have been a serious issues.

[system]

about -> instead of –>. something like this maybe:

<!-- some comment ->
<p>commented paraghraph</p>
<!-- some other comment -->
<p>uncommented paraghraph</p>

by ending the first comment with only one dash, its considering that its closing tag is now the end of the second comment. in other words, you invalidate the end tag for the first comment (and all the other comments in between) of the section you want to comment, section that must end with a comment that has a valid closing tag.

if there are other comments in between, these also need to have their end tag invalidated:

<!-- 1st comment ->
<p>commented paraghraph</p>
<!-- 2nd comment ->
<p>also commented paraghraph</p>
<!-- 3rd comment -->
<p>uncommented paraghraph</p>

so the opening tag for the first comment matches the closing tag for the third comment. this can be easily done with a search and replace on a selected section (search for –> and replace it with ->), and the resulting markup looks pretty nice

[gary_turner]

When a comment is opened with <!–, the browser seeks only the next double hyphen to close the comment. If the next instance is <!–, the comment is closed. See the test case:

<body>
  <!--
<p>this p is fully commented, and should not render</p>
  <!--
<p>this p is commented within broken comment tag, and will render</p> ->

<p>should be commented, but is not</p>
-->
<p>not commented</p>
</body>

Multiple double hyphens prior to the closing right angle bracket will toggle the comment on and off, though browser implementation is spotty.

cheers,

gary

[gary_turner]

The simplest solution for a large region containing several comments is as follows:[list=1][]Select the region to be commented.
[]Narrow the editor’s focus to that region.
[]Search for double hyphens, --, and replace with double equal signs, ==.
[]Add the new comment delimiters to top and bottom of region.
[*]Widen the focus back to the full buffer.[/list]
Switching back is a matter of using the same process to replace the double equals with double hyphens and remove your added comment delimiters.

cheers,

gary

[system]

@gary_turner

When a comment is opened with <!–, the browser seeks only the next double hyphen to close the comment. If the next instance is <!–, the comment is closed. See the test case:

<body>
  <!--
<p>this p is fully commented, and should not render</p>
  <!--
<p>this p is commented within broken comment tag, and will render</p> ->

<p>should be commented, but is not</p>
-->
<p>not commented</p>
</body>

Multiple double hyphens prior to the closing right angle bracket will toggle the comment on and off, though browser implementation is spotty.

cheers,

gary

i think you might want to test and review your above code:

 <!--
<p>this p is commented within broken comment tag, and will render</p> ->

<p>should be commented, but is not</p>
-->

all this is commented my replacement solution (–> with ->) prior to your post shows just that.

[system]

@gary_turner

The simplest solution for a large region containing several comments is as follows:[list=1][]Select the region to be commented.
[]Narrow the editor’s focus to that region.
[]Search for double hyphens, --, and replace with double equal signs, ==.
[]Add the new comment delimiters to top and bottom of region.
[*]Widen the focus back to the full buffer.[/list]
Switching back is a matter of using the same process to replace the double equals with double hyphens and remove your added comment delimiters.

cheers,

gary

your solution implies the use of a plus one comment, more than required, and makes for an pretty “ugly” markup so it’s really not the simplest out there.

[gary_turner]

@noonnope

i think you might want to test and review your above code:

 <!--
<p>this p is commented within broken comment tag, and will render</p> ->

<p>should be commented, but is not</p>
-->

all this is commented my replacement solution (–> with ->) prior to your post shows just that.

following is the resulting rendering of my test case, which supports my position. If you got different results, you either mis-implemented my example, or used a browser with incorrect support of the html comment.

not commented
this p is commented within broken comment tag, and will render ->

should be commented, but is not
-->

not commented

gary

[gary_turner]

@noonnope

your solution implies the use of a plus one comment, more than required, and makes for an pretty “ugly” markup so it’s really not the simplest out there.

I have no idea what you’re talking about. What do you mean by “plus one comment”? How is the markup uglified?

Starting with this:

<body>
<p>out of region</p>

<p>first p in region</p>
  <!--
<p>initial commented p.-->

<p>last p  in region</p>

<p>out of region</p>
</body>

Narrow to region:

<p>first p in region</p>
  <!--
<p>initial commented p.-->

<p>last p  in region</p>

Find and replace instances of “–” with “==”:

<p>first p in region</p>
  <!==
<p>initial commented p.==>

<p>last p  in region</p>

Add the new surrounding comment delimiters:

<!--<p>first p in region</p>
  <!==
<p>initial commented p.==>

<p>last p  in region</p>-->

Now widen focus back to the full buffer:

<body>
<p>out of region</p>

<!--<p>first p in region</p>
  <!==
<p>initial commented p.==>

<p>last p  in region</p>-->

<p>out of region</p>
</body>

There is no extra comment or whatever you mean, and markup is no uglier than it ever was.

gary

[system]

@gary_turner

following is the resulting rendering of my test case, which supports my position. If you got different results, you either mis-implemented my example, or used a browser with incorrect support of the html comment

i don’t know what you mean by those i’m only describing to you what your provided markup does. i’ve tested it in all big 5 (Ch, FF, IE, Op, Saf) and they all render the same.

let’s recap: you provided the following markup:

<body>
  <!--
<p>this p is fully commented, and should not render</p>
  <!--
<p>this p is commented within broken comment tag, and will render</p> ->

<p>should be commented, but is not</p>
-->
<p>not commented</p>
</body>

put in the body tag. if you copy/paste this in a test.html file and double click on it, no matter what UA you use, the rendered result will be the same: only the last <p> is showed. so you’re 2nd and 3rd <p>, that you imply will render, are not

[system]

as for the second example, the OP mentioned the existence of

a lot of other comments

as such, i see fit to start from here:

<p>outer paraghraph</p>
<!-- 1st comment -->
<p>1st inner paraghraph</p>
<!-- 2nd comment -->
<p>2nd inner paraghraph</p>
<!-- 3rd comment -->
<p>3rd inner paraghraph</p>
<!-- 4th comment -->
<p>outer paraghraph</p>

the solution that i sugested does not add any other weird markup (<== or ==>), it takes advantage of the fact that the closing tag for the comment element needs at least two dashes.

with this in mind, in order to comment all content between 1st and 4th comment, all you have to do is to invalidate the end tag for the 1st, 2nd and the 3rd comment, like this:

<p>outer paraghraph</p>
<!-- 1st comment ->
<p>1st inner paraghraph</p>
<!-- 2nd comment ->
<p>2nd inner paraghraph</p>
<!-- 3rd comment ->
<p>3rd inner paraghraph</p>
<!-- 4th comment -->
<p>outer paraghraph</p>

with a search for –> and replace with -> for a selection that stretches between and includes the 1st and the 3rd comment. simple and effective, and, may i add, very readable! no need for weird markup

[gary_turner]

You are taking advantage of a rendering bug in Opera, IE, and Webkit browsers. Firefox* renders correctly, as I have illustrated. Should these browsers fix the bug, your shortcut breaks, as it does now in Firefox.

See Anne van Kesteren, and [url=http://www.w3.org/TR/html4/intro/sgmltut.html#h-3.2.4]§3.2.4 Comments.

N.B. Replacing – with == is no more weird than replacing –> with ->, and is more visually obvious, which helps in debugging. In xml and xhtml, it’s a bit more helpful as a double hyphen is invalid within a comment.

gary

• Firefox in standards mode

[system]

it seems FF doesn’t agree with you

i was willing to take your word for it and test it again. i’ve put your test markup:

<body>
  <!--
<p>this p is fully commented, and should not render</p>
  <!--
<p>this p is commented within broken comment tag, and will render</p> ->

<p>should be commented, but is not</p>
-->
<p>not commented</p>
</body>

in a test.html file. tried it in FF 3.6.6 and it was rendering this:

not commented

thought that maybe in FF 3.6.8 things are different. so i updated my FF to 3.6.8 and test it again. the rendering is:

not commented

is there something i’m not doing right?

regarding html 4 specs, it says pretty clear:

3.2.4 Comments

HTML comments have the following syntax:

<!-- this is a comment –>
<!-- and so is this one,
which occupies more than one line –>
White space is not permitted between the markup declaration open delimiter(“<!”) and the comment open delimiter (“–”), but is permitted between the comment close delimiter (“–”) and the markup declaration close delimiter (“>”). A common error is to include a string of hyphens (“—”) within a comment. Authors should avoid putting two or more adjacent hyphens inside comments.

Information that appears between comments has no special meaning (e.g., character references are not interpreted as such).

Note that comments are markup.

meaning:

• the start tag <!–, with no spaces
• end tag –>, but there are spaces allowed between – and >, so it could be – >, but it seems UAs don’t agree to this one
• no use of – inside comments, but UAs are not affected, not even FF agrees; if i put – or — sequences between 1st and 4th with 1st to 3rd end tag comment invalidated (->) the rendering is still only outer paragraphs (this recommendation supposed to prove your point, but even here, there is a <!-- sequence, not a – sequence)
• comments are markup

nothing new here. your test case does not prove your position, FF or otherwise. your comment is not closed until you complete your – with a >, and if you don’t stick anything in between those other than white space, all works as is supposed to.

my “rendering bug” works even in FF, meaning that my proposition

<p>outer paraghraph</p>
<!-- 1st comment ->
<p>1st inner paraghraph</p>
<!-- 2nd comment ->
<p>2nd inner paraghraph</p>
<!-- 3rd comment ->
<p>3rd inner paraghraph</p>
<!-- 4th comment -->
<p>outer paraghraph</p>

works and renders the same way in all big 5 (including FF), as i’ve tested before posting :), like this

outer paraghraph

outer paraghraph

does “your” FF renders my test otherwise? or yours, for that matter? 'cos i even tried putting – and — in both of them and it didn’t make any impact, FF or otherwise. the only bad thing happens when i put white space between – and >, trying to use – > instead of –> as the closing sequence, which is/was never my intention

[Stevie_D]

@noonnope

it seems FF doesn’t agree with you

No, it seems you didn’t read what Gary wrote.

Firefox in standards mode renders the page as Gary said. If you fail to include a valid doctype, it doesn’t … but when you do a page for real, you’re always going to use a valid doctype, aren’t you¿

The other point that Gary made was that you are using a rendering bug, which exists in most current browsers, but that doesn’t mean it won’t be fixed. Doing something the wrong way “because it works (at the moment)” is exactly what made the web fall apart in 2005 and 2006, when people found that the bad code they had happily used in IE6 failed dismally in Fx and IE7. Who is to say that IE9, Opera 11 and Webkit x+1 won’t fix that bug? And if they do, your pages will be completely chuggered, while Gary’s and mine will carry on working just fine and dandy.

[system]

@Stevie_D

No, it seems you didn’t read what Gary wrote.

Firefox in standards mode renders the page as Gary said. If you fail to include a valid doctype, it doesn’t … but when you do a page for real, you’re always going to use a valid doctype, aren’t you¿

you’re (both) right (to some extent) about FF in standard mode and i will (use a doctype) so you have a VERY VALID POINT !

@Stevie_D

The other point that Gary made was that you are using a rendering bug, which exists in most current browsers, but that doesn’t mean it won’t be fixed.

one (wrong) point Gary made was that he doesn’t needs to close the comment tag, only to open a new one to close the last one, like the p tag, which is also

@Stevie_D

Doing something the wrong way “because it works (at the moment)” is exactly what made the web fall apart in 2005 and 2006, when people found that the bad code they had happily used in IE6 failed dismally in Fx and IE7.

he relies on the – second appearance. while – is for marking the begining and the ending of a comment, the comment is markup, and thus, needs to be enclosed between markup declaration delimiters: <,>. and so, probably, what you’ve said below

@Stevie_D

Who is to say that IE9, Opera 11 and Webkit x+1 won’t fix that bug? And if they do, your pages will be completely chuggered, while Gary’s and mine will carry on working just fine and dandy.

will apply to both our pages: completely chuggered! whose to say that IE9, Opera 11 and Webkit x+1 won’t fix that bug also?

but, if you’ve “read what noonnope wrote” you’ll see that he is not a fan of html comments, unless for ie behaviour targeting still, i admit, given FF case with standard mode, my proposal falls down the gutter

so allow me to give you a better one:

<p>outer paraghraph</p>
<style class="commented">
<!-- 1st comment -->
<p>1st inner paraghraph</p>
<!-- 2nd comment -->
<p>2nd inner paraghraph</p>
<!-- 3rd comment -->
<p>3rd inner paraghraph</p>
<!-- 4th comment -->
</style>
<p>outer paraghraph</p>

obviously, using an element with non-rendered content as a wrapper for the whole markup to be commented it’s a viable option. the class attribute “commented” of course, has no significance, html, css or js this eliminates any weird stuff inside your markup, any need for search and replace, and it’s (involuntary) pretty intuitive, because of the “commented” class, of course it will not validate, as style needs to be in the head, but hey…

[gary_turner]

@noonnope

one (wrong) point Gary made was that he doesn’t needs to close the comment tag, only to open a new one to close the last one, like the p tag, which is also

Please clarify what you mean. Unless I have a typo, the procedure is to replace each instance of “–” within the selected region with “==”, then add comment delimiters, “<!–” and “–>” at the beginning and end, respectively, of the region.

I do not see where I stated or even implied that a closing tag was unneeded. You may have misunderstood that the “–” is the toggle. Once a comment is opened, the next instance of “–” triggers the reset which terminates the comment at the next “>” it runs into. Throw an orphan double hyphen into the mix, and things really get strange.

cheers,

gary