<script type="text/javascript"> var ts=document.getElementsByTagName("li"); for (var i=0; i<ts.length;i++) { var text=ts[i].getAttribute("title"); alert(ts[i].getAttribute("title")) if(text) { ts[i].setAttribute("title","我会成功！") alert(ts[i].getAttribute("title")) } }
上面这段代码将先从文档里把已经带有title属性的<p>元素全部检索出来，然后把它们的title属性值全部修改为brand new title text。具体到“购物清单”文档，属性值a gentle reminder将被覆盖。
这里有一个非常值得关注的细节：通过setAttribute()方法对文档做出的修改，将使得文档在浏览器窗口里的显示效果和/或行为动作发生相应的变化，但我们在通过浏览器的view source（查看源代码）选项去查看文档的源代码时看到的仍将是原来的属性值——也就是说，setAttribute()方法做出的修改不会反映在文档本身的源代码里。这种“表里不一”的现象源自DOM的工作模式：先加载文档的静态内容、再以动态方式对它们进行刷新，动态刷新不影响文档的静态内容。这正是DOM的真正威力和诱人之处：对页面内容的刷新不需要最终用户在他们的浏览器里执行页面刷新操作就可以实现。
您可能感兴趣的文章: