Home > other >  How to comment out classes inside class=""? Is this even possible?
How to comment out classes inside class=""? Is this even possible?

Time:05-16

Is it possible to comment out specific classes inside the HTML (<div ...>)?

For example:

<div data-group="group1" data-container="true" >

Where in this example the class "slider" should be (temporarily) excluded from the class list.

This would make life a lot easier, in my opinion, in these ways:

  • You don't have to switch to your style sheet and go searching for the matching class, commenting out and switch back again to the code.
  • It's clear for everyone that you just exclude the complete function, which - if named clearly - gives other developers a better overview.
  • For testing purposes you could use this as (style) modules, which are enabled/disabled in a snap! Again, no more hopping between screens/tabs/windows.
  • Easier debugging. Just comment out some classes and you've got the source of the problem in no time.
  • It stimulates developers to use recognizable and clearly named classes

Currently I copy the whole element/row, comment this out and add a comment and then paste the copied row below. Then I remove classes from this line of code.

Most of the time this doesn't get updated, so you can't see it as a reliable backup if you're debugging.

I know for sure that such would be possible with JS, but why? (Also changing the HTML structure with JS gives a lot of headaches when it comes to layout shifts and not everyone has the possibility to make use of server side scripting.) Such should exist HTML in my opinion.

Am I the only one who has this in mind?

CodePudding user response:

Per the HTML Specification on the class attribute:

When specified on HTML elements, the class attribute must have a value that is a set of space-separated tokens representing the various classes that the element belongs to.

Here is the definition for space-separated tokens:

A set of space-separated tokens is a string containing zero or more words (known as tokens) separated by one or more ASCII whitespace, where words consist of any string of one or more characters, none of which are ASCII whitespace.

A string containing a set of space-separated tokens may have leading or trailing ASCII whitespace.

Therefore, no, you should technically not be allowed to comment out class list members in any way. If any implementation of the specification does allow this, then it is undefined behavior and should not be depended upon.

CodePudding user response:

Comments in HTML are just like any other tag, therefore it is not possible to comment out attributes or classes etc.

I usually just rename the attribute I want to "disable". If you just want to remove one class, your approach with copying the line and commenting the original one out is probably best.

CodePudding user response:

WARNING - though I have happily used this commenting and browsers seem to cope OK (and W3C validator does not object) comments from @sn02 under their answer suggest that there is no comment facility within the attribute's value string. So use it at your peril...

I leave this here for others to comment on.

From MDN:

Comments can be placed wherever white space is allowed within a style sheet. They can be used on a single line, or traverse multiple lines.

And given browser's use this method to unset a property if you unselect it in the dev tools inspect facility it would appear to be OK to do this.

CodePudding user response:

You could use inline style and add your stuff in there . just check it back in dev tools

<th style ="/*color:red;*//*margin:auto;*/">Color</th>
  • Related