Как использовать атрибуты data-* не загромождая html код?

Question

[Tortway]

Привет всем.
Предлагаю обратить внимание на скриншот:

На нём видно, что во всех тегах td, кроме последнего, написано:
data-toggle="collapse" data-target="#content-1"
По мне, это выглядит громоздко, особенно, если подобных строк в таблице очень много.
Конечно же, я мог написать эти атрибуты в tr, а td оставить пустыми, но, как вы понимаете, делать этого не стал, по той причине, что последняя колонка не должна их иметь. Дело в том, что последняя колонка содержит кнопки, при нажатии на которые коллапс не должен раскрываться.

Буду рад вашим предложениям, как эту проблему решить, сделать код менее громоздким.

Answer 1

[Ростислав Григорьев]

А почему не поставить data-атрибут на tr, а в выборке в скрипте прописать раскрытие коллапса не на все колонки, а только те что без класса icons-row:

$('td:not(.icons-row)').on('click', function(){ /*  код сворачивания */  })

Comments

[Tortway]

Круто! То что надо. Я и сам уже начал был мудрить с .on('click',..), но у тебя намного лучше вариант. Спасибо!

Answer 2

[Tortway]

Спасибо пользователю Сrazyzubr за ответ. Благодаря ему, я придумал этот код:


javascript:

Comments

[Али Алиев]

точки с запятыми расставьте )

[Tortway]

@ali_aliev: как-нибудь расставлю, привычка с ruby осталась))

Answer 3

[bromzh]

Одна из целей использования data-атрибутов - как раз уменьшить количество строк js-кода. Например, в бутстрапе всякие табы и прочие элементы используют их, чтобы не прописывать поведение переключалок вручную в js. Так что польза их не писать там, где позволяет библиотека. весьма сомнительная. С другой стороны, если всё равно надо писать что-то на js с использованием таких атрибутов, то можно всё убрать в js. Тогда будет нагромождение в js-коде.

Answer 4

[Валентин]

https://api.jquery.com/jquery.data