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".'