开发者

documenting div sections, use title attribute?

开发者 https://www.devze.com 2023-04-05 01:13 出处:网络
I\'m looking for the most terse way to document sections of my page, e.g. div sections. Anything wrong with using the title attribute, e.g.

I'm looking for the most terse way to document sections of my page, e.g. div sections.

Anything wrong with using the title attribute, e.g.

<div title="Payment Area" class="form">
   ...
</div>

?

P.S. In case relevant, I'm using the IntelliJ IDE, but new to its various capabilities, e.g. automatic formatting control and other ways to be able to easily understand sections of开发者_C百科 my pages.


If an element has a title attribute, most browsers show a tooltip with the attribute’s value when you hover over it. In this case, they’ll show a “Payment Area” tooltip when you hover anywhere over that div.

HTML attributes, in general, have a purpose. HTML has comments for documentation! Try them:

<div class="form"> <!-- Payment Area -->
    ...
</div>

You mentioned that you didn't want the overhead of comments. If you count up the characters (including the required space before the attribute, they're actually the same length:

 title="Payment Area"
<!-- Payment Area -->

(But, I agree, they do look bigger!)


I would probably use ids, that way you can also use them as hooks for your CSS and JavaScript.

Otherwise, Gabe's Answer makes a good case for data attributes. John Resig explains why they are good here: http://ejohn.org/blog/html-5-data-attributes/


I would recommend using the HTML5 custom attributes standard:

<div data-title='Payment Area'></div>

Basically, precede the name with data- and the browser will ignore it.


The title attribute isn't meant for divs - I haven't checked the official specs, but I don't think it's even a supported attribute. The better practice is to use the "id" attribute. This has the added benefit of providing hooks for your CSS.

You can also take it a step further and use html5, which provides you with more descriptive elements such as <nav>, <section>, <article> and <header>


Edit: as per comment by steveax, the title attribute isn't invalid. I think the gist of my answer remains valid, though.


You can use the rel="" attribute, that works pretty well for me, I don't think title works on divs

<div rel="Payment Area"></div>
0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号