update
update(element[, newContent]) -> HTMLElement
替换 element
的内容为参数 newContent
指定的内容,返回元素本身。
译注:该方法类似于 element.innerHTML = newContent
。
newContent
可以是纯文本、HTML 片断或任意具有 toString()
方法的 JavaScript 对象。
如果 newContent
中包含 <script>
标签,更新后将会自动运行标签中所包含的 Javascript
代码(Element.update
方法内部调用了 String#evalScripts 方法)。
如果未提供参数,Element.update
将简单的清除 element
的内容。
注意:在 IE6 及以上版本中,该方法允许对与元素相关的表的内容进行无缝更新。
样例
<div id="fruits">carrot, eggplant and cucumber</div>
传递一个普通的字符串:
$('fruits').update('kiwi, banana and apple');
// -> HTMLElement
$('fruits').innerHTML
// -> 'kiwi, banana and apple'
清除元素的内容:
$('fruits').update();
// -> HTMLElement
$('fruits').innerHTML;
// -> '' (一个空字符串)
使用一个 HTML 片断:
$('fruits').update('<p>Kiwi, banana <em>and</em> apple.</p>');
// -> HTMLElement
$('fruits').innerHTML;
// -> '<p>Kiwi, banana <em>and</em> apple.</p>'
具有 <script> 标签的 HTML 片断:
$('fruits').update('<p>Kiwi, banana <em>and</em> apple.</p><script>alert("updated!")</script>');
// -> HTMLElement(并弹出提示框显示:"updated")
$('fruits').innerHTML; // -> '<p>Kiwi, banana <em>and</em> apple.</p>'
使用 toString()
方法:
$('fruits').update(123);
// -> HTMLElement
$('fruits').innerHTML;
// -> '123'
最后,在自定义对象中增加 toString
方法,实现一些有趣的功能:
var Fruit = Class.create();
Fruit.prototype = {
initialize: function(fruit){ this.fruit = fruit; },
toString: function(){ return 'I am a fruit and my name is "' + this.fruit + '".'; }
}
var apple = new Fruit('apple');
$('fruits').update(apple);
$('fruits').innerHTML;
// -> 'I am a fruit and my name is "apple".'