2011-01-29 53 views
11

如何更改JavaScript中的HTML对象元素数据属性值?如何更改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"); 
+0

你尝试过什么?什么没有用?你可以发布你的HTML和JavaScript? – Oded 2011-01-29 10:23:57

回答

9

和jQuery中:

$('element').attr('some attribute','some attributes value') 

$('a').attr('href','http://www.stackoverflow.com/') 
33

这工作:

<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> 

如果你把它放进一个文件,请在有网络浏览器,JavaScript的执行,并与“数据“属性+值将被添加到对象元素。

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

使用Firefox + Firebug或Google Chrome,您可以右键点击页面的一部分并执行“检查元素”。这将调出渲染的DOM的视图。

+0

我已经尝试过那些,但没有水果,你可以请你张贴样品的例子,你已经测试了谢谢 – user587159 2011-01-29 10:37:02

1

主机的行为对象<object>是由于ECMA262实现相关的,并设置由setAttribute()方法属性可能会失败。

我看到两个解决方案:

  1. 软:element.data = "http://www.google.com";

  2. 难:从DOM树删除对象,并创建新的一个与改变的数据属性。

0

下面的代码工作,如果你使用jquery

$("object").replaceWith('<object data="http://www.google.com"></object>'); 
0
document.getElementById("PdfContentArea").setAttribute('data', path); 

OR

var objectEl = document.getElementById("PdfContentArea") 

objectEl.outerHTML = objectEl.outerHTML.replace(/data="(.+?)"/, 'data="' + path + '"'); 
相关问题