Définir un attribut sans valeur

194

Comment définir un attribut de données sans ajouter de valeur dans jQuery? Je veux ceci:

<body data-body>

J'ai essayé:

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

Tout le reste semble ajouter le deuxième argument sous forme de chaîne. Est-il possible de simplement définir un attribut sans valeur?

— David Hellsing
source

3

Pourquoi avez-vous besoin de data-bodyvs data-body=""?

— Pilules d'explosion

Au moins si vous souhaitez utiliser XHTML, vous ne devriez pas le faire car la minimisation des attributs n'est pas autorisée.

— Matthias

9

Je n'utilise pas XHTML, j'utilise HTML5

— David Hellsing

2

@ user1689607 car j'enregistre le code HTML généré sous forme de chaîne et j'ai besoin de faire une recherche inversée plus tard.

— David Hellsing

4

@ExplosionPills Un exemple est l' requiredattribut pour la validation de formulaire HTML5. Je suis sûr qu'il existe de nombreux autres cas d'utilisation valides.

— Zero3

250

La attr()fonction est également une fonction de définition. Vous pouvez simplement lui passer une chaîne vide.

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

Une chaîne vide créera simplement l'attribut sans valeur.

<body data-body>

Référence - http://api.jquery.com/attr/#attr-attributeName-value

attr (AttributeName, value)

— Lix
source

24

+1, mais l'OP sait que c'est un passeur. Le fait que passer une chaîne vide fonctionne mais nullne l'est pas est quelque peu surprenant.

— Jon

2

Javasctipt a des comportements étranges . Savoir où ces bizarreries se produisent supprimera l'élément de surprendre: P

— Lix

25

Remarque: Cela ne fonctionne pas avec jQuery 1.7.2 (je sais que ce n'est pas la dernière version) mais l'utilisation a $(el).prop('data-body', true)fonctionné pour moi où j'ai $(el).attr('data-body', '')fini par définir data-body = "data-body" pour moi.

— Patrick O'Doherty

6

@ PatrickO'Doherty $(el).prop('data-body', true)ne fonctionne pas pour moi. attr()fonctionne mais il ajoute également une chaîne vide comme valeur de l'attribut que je veux ajouter.

— Webdevotion

1

@Andrew Je crois que vous recherchez les fonctions removeAttr / prop . Cela dépend de l'attribut que vous essayez de supprimer.

— Lix

47

Essayez peut-être:

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

— Callum McLean
source

2

Seule cette solution a fonctionné pour moivar btn = $(this).get(0); btn.setAttribute("disabled","");

— gkiko

1

Après avoir dérangé avec .attr et .prop, comme suggéré dans toutes les autres solutions et commentaires ici, j'ai finalement trouvé que revenir (ou au moins "à mi-chemin") à JS natif, faisait l'affaire, comme suggéré dans le commentaire ci-dessus ... Bravo pour ça!

— TheCuBeMan

22

La réponse acceptée ne crée plus d'attribut de nom uniquement (depuis septembre 2017).

Vous devez utiliser la méthode JQuery prop () pour créer des attributs de nom uniquement.

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

— Charlie
source

En fait, il semble que j'ajoute "value = 'true'" à mon option de sélection, au lieu de simplement "value". Pouah.

— RonLugge

je me demandais comment la réponse acceptée ne contenait pas cette solution! c'est la façon la plus propre d'utiliser jquery.

— denns

Ne fonctionne pas dans certaines options de liste déroulante, dans Chrome malheureusement

— MC9000

7

Vous pouvez le faire sans jQuery!

Exemple:

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

<button>My disabled button!</button>

Développer l'extrait

Pour définir la valeur d'un attribut booléen, tel que désactivé, vous pouvez spécifier n'importe quelle valeur. Une chaîne vide ou le nom de l'attribut sont des valeurs recommandées. Tout ce qui compte, c'est que si l'attribut est présent, quelle que soit sa valeur réelle, sa valeur est considérée comme vraie. L'absence de l'attribut signifie que sa valeur est fausse. En définissant la valeur de l'attribut désactivé sur la chaîne vide (""), nous définissons désactivé sur vrai, ce qui entraîne la désactivation du bouton.

Depuis MDN Element.setAttribute ()

— LipESprY
source

1

jQuery est trop floconneux à cet égard. Il vaut mieux faire en javascript de peur de vous rendre fou chaque fois que jquery ou les navigateurs changent. Cela vaut pour tous ces frameworks clients buggy.

— MC9000

1

Je ne sais pas si c'est vraiment bénéfique ou pourquoi je préfère ce style mais ce que je fais (en vanille js) est:

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

Cela ajoutera l'attribut en minuscules sans valeur ou le supprimera s'il existe déjà sur l'élément.

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

— Brent N.
source