Встановити атрибут без значення

194

Як встановити атрибут даних, не додаючи значення в jQuery? Я хочу це:

<body data-body>

Я намагався:

$('body').attr('data-body'); // this is a getter, not working
$('body').attr('data-body', null); // not adding anything

Все інше, здається, додає другі аргументи як рядок. Чи можна просто встановити атрибут без значення?

— Девід Гелсінг
джерело

3

Навіщо вам потрібен data-bodyVS. data-body=""?

— Вибухові таблетки

Принаймні, якщо ви хочете використовувати XHTML, ви не повинні робити цього, оскільки мінімізація атрибутів не дозволена.

— Маттіас

9

Я не використовую XHTML, я використовую HTML5

— Девід Хеллінг

2

@ user1689607, тому що я зберігаю згенерований HTML як рядок і мені потрібно потім зробити зворотний пошук.

— Девід Гелсінг

4

@ExplosionPills Одним із прикладів є requiredатрибут перевірки форми HTML5. Я впевнений, що існує багато інших дійсних випадків використання.

— Zero3

251

Ця attr()функція також є функцією сеттера. Ви можете просто передати це порожнім рядком.

$('body').attr('data-body','');

Порожній рядок просто створить атрибут без значення.

<body data-body>

Довідка - http://api.jquery.com/attr/#attr-attributeName-value

attr (attributeName, value)

— Лікс
джерело

24

+1, але ОП знає, що це сетер. Те, що передача порожньої рядки працює, але nullне є дещо дивовижним.

— Джон

2

Javasctipt має деякі дивні поведінки . Знаючи, де трапляються ці дивацтва, виведе елемент

— надмірності

25

Примітка. Це не працює з jQuery 1.7.2 (я знаю, що це не остання версія), але з використанням $(el).prop('data-body', true)працював для мене там, де $(el).attr('data-body', '')закінчилося встановлення для мене data-body = "data-body".

— Патрік О'Дохерті

6

@ PatrickO'Doherty $(el).prop('data-body', true)для мене не працює. attr()працює, але він також додає порожній рядок як значення атрибута, який я хочу додати.

— Webdevotion

1

@Andrew Я вважаю, що ви шукаєте функції removeAttr / prop . Це залежить від того, який атрибут ви намагаєтеся видалити.

— Лікс

47

Можливо, спробуйте:

var body = document.getElementsByTagName('body')[0];
body.setAttribute("data-body","");

— Каллум Маклін
джерело

2

Тільки це рішення працювало для менеvar btn = $(this).get(0); btn.setAttribute("disabled","");

— gkiko

1

Розгубившись з .attr та .prop, як це було запропоновано у всіх інших рішеннях та коментарях, я нарешті виявив, що повертаючись назад (або принаймні "на півдорозі" назад) до рідного JS, зробив трюк, як було запропоновано в коментар вище ... Ура за це!

— TheCuBeMan

22

Загальноприйнятий відповідь не створити атрибут ім'я тільки більше (за станом на вересень 2017 року).

Ви повинні використовувати метод JQuery prop () для створення атрибутів лише імен.

$(body).prop('data-body', true)

— Чарлі
джерело

Насправді, мені здається, що ви додаєте "value = 'true" до мого вибору, а не просто "value". Тьфу.

— RonLugge

мені було цікаво, як прийнята відповідь не містить цього рішення! це найчистіший спосіб використання jquery.

— денс

Не працює у виборі параметрів, що випадають, у Chrome на жаль

— MC9000

7

Ви можете це зробити без jQuery!

Приклад:

document.querySelector('button').setAttribute('disabled', '');

<button>My disabled button!</button>

Розгорніть фрагмент

Щоб встановити значення булевого атрибута, наприклад відключеного, можна вказати будь-яке значення. Порожній рядок або ім’я атрибута - рекомендовані значення. Важливо лише те, що якщо атрибут взагалі присутній, незалежно від його фактичного значення, його значення вважається істинним. Відсутність атрибута означає, що його значення хибне. Встановлюючи значення атрибута вимкнено в порожній рядок (""), ми встановлюємо відключений значення true, внаслідок чого кнопку відключається.

Від MDN Element.setAttribute ()

— LipESprY
джерело

1

jQuery в цьому плані занадто лускатий. Найкраще робити в JavaScript, щоб не зводити з розуму щоразу, коли змінюються jquery або браузери. Це стосується всіх цих баггічних систем клієнта.

— MC9000

1

Не впевнений, чи справді це вигідно чи чому я віддаю перевагу цьому стилю, але те, що я роблю (у ванільному js):

document.querySelector('#selector').toggleAttribute('data-something');

Це додасть атрибут у всі малі регістри без значення або видалить його, якщо він вже існує на елементі.

https://developer.mozilla.org/en-US/docs/Web/API/Element/toggleAttribute

— Брент Н.
джерело