Question

document.getElementById('divw').data-value=james;

<link rel="stylesheet" type="text/css" href="loading-bar.css"/>
<script type="text/javascript" src="loading-bar.js"></script>


<div id="divw" class="ldBar" data-type="fill" data-img="https://www.mediumpath.com/images/logo.png"></div>

以上是我的代码，我想将data-value属性添加到ID为divw的元素中，但似乎该属性没有值，请告诉我什么地方错了？预先感谢。

Answer 1

Element.setAttribute()

设置指定元素上的属性的值。如果属性已经存在，则更新值；否则，将添加具有指定名称和值的新属性。

请注意：由于james是字符串，因此必须用引号将其引起来。

通过以下方式使用setAttribute()：

document.getElementById('divw').setAttribute('data-value', 'james');

// check the new value with getAttribute()
console.log(document.getElementById('divw').getAttribute('data-value'));

<link rel="stylesheet" type="text/css" href="loading-bar.css"/>
<script type="text/javascript" src="loading-bar.js"></script>


<div id="divw" class="ldBar" data-type="fill" data-img="https://www.mediumpath.com/images/logo.png"></div>

Answer 2

对于大多数属性，.setAttribute()是读取和操纵它们的好方法，但是数据属性有些特殊。除了使用.setAttribute()，您还可以对access data- attribute使用数据集属性：

var mydiv = document.getElementById('divw');

divw.dataset.value = "blah";

请注意，在使用数据集时，您需要删除data-前缀，并将其余名称从kebab-case转换为camelCase。

用Java处理数据

2 个答案: