javascript - 如何更改其中包含无效字符的元素的属性？

Question

假设我有这个 HTML 元素:

<div id="n1" nameok="hello">

如果我想用JS改变nameok属性，很简单:

var x = document.getElementById("n1");
x1.nameok = 'new value';

但是假设我有另一个元素，像这样:

<div id="n2" name-not-ok="hello">

然后，第二行产生错误:

var x = document.getElementById("n2");
x2.name-not-ok = 'new value';

我想问题出在“-”上，这很可能是不允许的，所以我尝试了类似的方法

x2."name-not-ok" = 'new value';
x2("name-not-ok") = 'new value';

但是没有用。 我尝试用 Google 搜索，但在属性名称中出现“禁止”字符的情况下，我找不到正确的语法。

当然，我可以修改相应的 CSS 来避免使用带有“-”的属性，然后更改我所有的 HTML 代码……但首先，这个属性是我没有编写的“包”的一部分，其次...必须有办法 ;)

Answer 1

使用setAttribute如下

x2.setAttribute('name-not-ok', 'new val');

我建议对自定义属性使用 data-* 属性。

x2.dataset.nameOk = 'new val';