如何在javascript中更改HTML对象元素数据属性值

use*_*159 20 html javascript object

如何在JavaScript中更改HTML对象元素数据属性值?

这是我正在尝试的

<object type="text/html" id="htmlFrame" style="border: none;" standby="loading" width="100%"></object>

 var element = document.getElementById("htmlFrame");
 element.setAttribute("data", "http://www.google.com");
Run Code Online (Sandbox Code Playgroud)

Ric*_*d H 42

这有效:

<html>
<head></head>
<body>

<object type="text/html" id="htmlFrame" style="border: none;" standby="loading" width="100%"></object> 

<script type="text/javascript">
  var element = document.getElementById("htmlFrame"); 
  element.setAttribute("data", "attributeValue"); 
</script>

</body>
</html>
Run Code Online (Sandbox Code Playgroud)

如果你把它放在一个文件中,在它上面打开一个Web浏览器,javascript就会执行,并且"data"属性+值将被添加到object元素中.

注意:如果您只是查看HTML源代码,则不会看到该属性.这是因为浏览器向您显示Web服务器发送的静态源,而不是动态呈现的DOM.要检查DOM,请使用Firebug之类的工具.这将显示浏览器呈现的DOM,您将能够看到添加的属性.

使用Firefox + Firebug或Google Chrome,您可以右键单击页面的一部分并执行"检查元素".这将显示渲染的DOM的视图.


WEB*_*ect 12

在jquery中:

$('element').attr('some attribute','some attributes value')
Run Code Online (Sandbox Code Playgroud)

$('a').attr('href','http://www.stackoverflow.com/')
Run Code Online (Sandbox Code Playgroud)

  • 这是jquery,不是javascript。 (9认同)

Vig*_*gar 7

在JavaScript中,您可以通过Element.dataset将值分配给数据属性。

例如:

avatar.dataset.id = 12345;
Run Code Online (Sandbox Code Playgroud)

参考:https : //developer.mozilla.org/en/docs/Web/API/HTMLElement/dataset


小智 6

document.getElementById("PdfContentArea").setAttribute('data', path);
Run Code Online (Sandbox Code Playgroud)

或者

var objectEl = document.getElementById("PdfContentArea")

objectEl.outerHTML = objectEl.outerHTML.replace(/data="(.+?)"/, 'data="' + path + '"');
Run Code Online (Sandbox Code Playgroud)