设置没有值的属性

194

如何设置数据属性而不在jQuery中添加值？我要这个：

<body data-body>

我试过了：

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

其他所有内容似乎都将第二个参数添加为字符串。是否可以只设置没有值的属性？

— 戴维·海灵
source

3

为什么需要data-body对data-body=""？

— 爆炸药，2012年

至少如果您要使用XHTML，则不应这样做，因为不允许属性最小化。

— 马提亚斯（Matthias）

9

我不使用XHTML，而是使用HTML5

— David Hellsing 2012年

2

@ user1689607，因为我将生成的HTML保存为字符串，并且稍后需要进行反向查找。

— David Hellsing，2012年

4

@ExplosionPills一个示例是requiredHTML5表单验证的属性。我确定还有许多其他有效的用例。

— Zero3

250

该attr()功能也是设置器功能。您可以将一个空字符串传递给它。

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

空字符串将仅创建没有值的属性。

<body data-body>

参考-http://api.jquery.com/attr/#attr-attributeName-value

attr（attributeName，value）

— 利克斯
source

24

+1，但OP知道这是个塞特犬。传递空字符串的事实有效，但null并不令人惊讶。

— 2012年

2

Javasctipt有一些奇怪的行为。知道这些怪异发生在哪里会排除掉

— 惊奇

25

注意：这不适用于jQuery 1.7.2（我知道这不是最新版本），但是$(el).prop('data-body', true)对我有用，$(el).attr('data-body', '')最终为我设置了data-body =“ data-body”。

— Patrick O'Doherty

6

@ PatrickO'Doherty $(el).prop('data-body', true)对我不起作用。 attr()确实可以，但是它还会添加一个空字符串作为我要添加的属性的值。

— Webdevotion

1

@Andrew我相信您正在寻找removeAttr / prop函数。这取决于您要删除的属性。

— Lix

47

也许尝试：

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

— 卡勒姆·麦克莱恩（Callum McLean）
source

2

只有这种解决方案对我var btn = $(this).get(0); btn.setAttribute("disabled","");

— 有用

1

像这里所有其他解决方案和注释中所建议的那样，在弄乱了.attr和.prop之后，我终于发现，回到（或至少是“半途而废”）本机JS可以做到这一点，就像在在上面评论...为此加油！

— TheCuBeMan

22

该接受的答案不会再创建一个名称唯一属性（9月2017）。

您应该使用JQuery prop（）方法创建仅名称属性。

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

— 查理
source

实际上，我似乎在选择选项中添加了“ value ='true'”，而不仅仅是“ value”。啊。

— RonLugge

我想知道如何接受的答案不包含此解决方案！这是使用jquery的最干净的方法。

— Denns

很遗憾，Chrome无法在选择下拉菜单选项中使用

— MC9000，19年

7

您无需jQuery就可以做到！

例：

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

<button>My disabled button!</button>

展开摘要

要设置布尔属性的值（例如禁用），可以指定任何值。建议使用空字符串或属性名称。重要的是，如果根本不存在该属性，则不管其实际值如何，都将其值视为真实。该属性的缺失表示其值是false。通过将Disabled属性的值设置为空字符串（“”），我们将disable设置为true，这将导致按钮被禁用。

来自MDN Element.setAttribute（）

— 嘴唇
source

1

jQuery在这方面过于宽容。最好在javascript中执行操作，以免每次jquery或浏览器发生变化时都让自己发疯。这适用于所有这些错误的客户端框架。

— MC9000

1

不知道这是否真的有用，还是不确定为什么我喜欢这种样式，但是我所做的（在香草js中）是：

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

这将以小写形式添加没有值的属性，或者如果元素上已经存在该属性，则将其删除。

https://developer.mozilla.org/zh-CN/docs/Web/API/Element/toggleAttribute

— 布伦特N.
source