盡管js可以想面向對象那樣去構造對象，隱藏私有方法，但需求變化的往往比你寫程序還要快時，就連設計js對象的時間也沒有了，所以我比較傾向於用js私有函數和js方法；jquery私有函數和jquery對外暴露方法的形式也可以實現，而頁面生成的html結構則完全在js中生成，包括哪些id和class， 這樣可以最大限度的確保統一和重用的方便性，但也有個缺點，就是在重用時，如果需要樣式發生變化（結構是死的不能變化），就需要用div將原來的結構包起來，相關的樣式也需要用對應的id包裹一遍，如果是新增的事件等就只能采用綁定的方式，暫時還沒有好的方法
例如，我面要實現 在一個div中包含幾張圖片
這樣做也有個缺點 就只 css 必須得復制一次 在做修改 但對結構和樣式以及js可以重用
. 代碼如下:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/javascript">
var publicSetDiv = function (url, id) {
//作為對外公開的，可以傳參就行
this.makediv = function (j) {
var imglist = makeimglist(url, j);
$(id).html(imglist);
$(id).show();
}
//私有的
function makeimglist(url, j) {
var i = 0;
//var j = 10;
var html = "";
for (i; i < j; i++) {
html += "<img src='" + url + "' class='item' />";
}
return html;
}
}
$(document).ready(function () {
// Handler for .ready() called.
var mytest = new publicSetDiv("http://images.cnblogs.com/logo_small.gif", "#test");
mytest.makediv(10);
var mytest2 = new publicSetDiv("http://images.cnblogs.com/logo_small.gif", "#test2");
mytest2.makediv(10);
});
</script>
<%-- 原始默認 的樣式--%>
<style type="text/css">
.item{ width:200px; height:100px; }
#test2 .item{ width:200px; height:100px; }
</style>
<%-- 第二次使用該樣式並稍作修改 --%>
<style type="text/css">
#test2 .item{ width:200px; height:200px; background-color:Black; }
</style>
</head>
<body>
<form id="form1" runat="server">
第一次使用
<div id="test" style=" display:none;">
</div>
<div id="test2" style=" display:none;">
</div>
</form>
</body>
</html>