javascript setAttribute

Question

我使用javascript setAttribute进行如下操作，将'lorem ipsum‘改为'coming’：

<span id="pop_title" name="pop_title" class="title01_mc10401 ff_1 fs_10 fc22 fsb">lorem ipsum</span>

脚本：

function modifyDOM(){
  var elem_pop = document.getElementById("pop_title");
  elem_pop.setAttribute("value","coming");
}

当我在firebug中检查时，它显示value属性是随其一起添加的，但它在浏览器中反映出来(我使用的是mozilla 3.0.5)，这可能是什么问题？是否需要设置不同的属性?？

Answer 1

span元素没有value属性。请尝试设置其innerHTML：

elem_pop.innerHTML = "coming";

Answer 2

有两种方法可以(正确地)做到这一点。你可以在这里使用这种跨浏览器的方法：

elem_pop.appendChild( document.createTextNode('coming') );

另一种方法是使用elem_pop.textContent和/或elem_pop.innerText，但不幸的是它们不能跨浏览器工作。IE只支持innerText，火狐，Chrome只支持textContent - Opera是唯一一个同时支持两者的浏览器。

您可以使用elem_pop.innerHTML，但是请注意，innerHTML会将HTML标记插入到页面中，而不仅仅是文本。这意味着它不会将任何特殊字符转义为实体。它还会自动替换任何子节点，并可以销毁事件侦听器。

我推荐第一种(appendChild())方法，但是如果你想使用textContent/innerText，你可以把下面的代码放在脚本的顶部：

HTMLElement.prototype.__defineGetter__('innerText', function(){ return this.textContent; });
HTMLElement.prototype.__defineSetter__('innerText', function(t){ this.textContent=t; });

这将给予火狐innerText支持，你可以随心所欲地使用它。

Answer 3

在这里使用.innerHTML，如下所示：

function modifyDOM(){
  var elem_pop = document.getElementById("pop_title");
  elem_pop.innerHTML = "coming";
}

You can try it here。设置value属性类似于<input>元素，当您想要替换元素标记中的html时，请使用.innerHTML。