Programming Design Notes

做法非常簡單，例如要在 body 內增加一個 image 的元件，你可能僧使用以下的方法。

$(document).ready(function(){
    var img = new Image();
    img.src = "http://l.yimg.com/mq/i/nws/mntl/20100317_FC_WingLee.jpg";
    $("body").append(img);
});

這是 Javascript 新增 Dom 元件的其中一個方法，原來 jQuery 也有提供了方法去新增 Dom 元件，而且更為簡單。
例子:

var img = $("<img>").attr({
    'src': 'http://l.yimg.com/mq/i/nws/mntl/20100317_FC_WingLee.jpg'
});
$("body").append(img);

新增 <a> 這個標籤也一樣

var googleLink = $("<a>").attr({
    'href': 'http://www.google.com'
}).text("Google");
$("body").append(googleLink);

jQuery 的方法更為直接簡單，只需將 html 標籤加到 $() 內便可。有一點要注意，img 是 Dom 物件，並不是 jQuery 物件，要用 jQuery 操作 Dom 物件要用以下方法。

var img = $("<img>");
$(img).attr({
    'src': 'http://l.yimg.com/mq/i/nws/mntl/20100317_FC_WingLee.jpg'
});
$("body").append(img);

相關書籍: