为Javascript访问命名HTML元素的属性是什么

Question

What HTML attribute should I use to name HTML elements that I want to address from Javascript. For example if I could use name :

<table id="some_table">
  <tr>
    <th name="date">Date</td>
    <th name="time">Time</td>
    <th name="name">Name</td>
  </tr>
  <tr>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td></td>
    <td></td>
    <td></td>
  </tr>
</table>

I could select them with jQuery like this:

$('#some_table th[name=time]')

This, however, is invalid, as name is not allowed for td . id must be unique, so I can't use it either. class could affect the styling if there is a CSS class .time . Maybe something like data-name ? What is the preferred way?

Answer 1

To expand on my comment, you don't "need to give the td some attribute with the column name". The standard way would be to get the column index from the column name, then retrieve all tds with this index.

For example if time is the second column (index 1), all the time tds are:

getElementById("some_table").rows[i].cells[1]

(JavaScript has native methods to traverse tables)

Answer 2

You can select elements via their id value, their name, their tagName, their proximity to other elements, any of their values, or even via a selector string. There is no single preferred method; it all depends on what you're attempting to do.

In your case, you could select table rows and cells via their index if you like. You could also, as you pointed out, use a data attribute - either approach would render the results you want, a way to access your elements.