[whatwg] href on any element

Kornel Lesinski kornel at osiolki.net
Tue Aug 29 15:40:27 PDT 2006

On Tue, 29 Aug 2006 22:55:01 +0100, Matthew Raymond  
<mattraymond at earthlink.net> wrote:

>> Having data table representing list of items where large clickable area  
>> is useful - i.e. inbox in a webmail, list of contacts, forum threads  
>> listing, etc.
>> I've ran into this problem many times and seen many questions about this
>> on forums/usenet.
>> My current solution is:
>> <tr onclick="this.getElementsByTagName('a')[0].click()">
>    This can be accomplished by having <a> elements in each individual
> cell...

Ofcourse it can, but it bloats code a lot. You have to add several  
redundant links, add tabindex=-1 to avoid breaking keyboard navigation,  
move all table and cell styles to anchors, and if cells contain block  
elements you have to bloat your code even more.

>> Another situation where I wanted href on any element was advertisement:
>> <div href="/buy">
>> <p>My product is:</p>
>> <ul>
>> <li>Cool</li>
>> <li>Great</li>
>> <li>And soo semantic</li>
>> </ul>
>> </div>
>    People don't typically don't initiate a purchase in a user interface
> by clicking on the product description.

Make it href="/info" then. Sometimes it doesn't make sense to have  
separate page for each listed detail.

Ofcourse you can live without href on every element if you apply a bit of  
scripting and CSS tricks, but the same thing can be said about almost  
every thing in WHATWG specifications.

It can have some backwards-compatibility. AFAIK XHTML/2 allows nested  
anchors, so I'd use it like this:

<tr href=".."><td><a href="..">anchor</a></td><td>no anchor</td><td>no  
anchor</td><td>no anchor</td></tr>

With some scripting (see first code in this post) this could work in  
current browsers and had fallback for bots and non-JS agents.

regards, Kornel Lesiński

More information about the whatwg mailing list