1.基本文件的引入。
<script src="local/jquery-2.3.3.min.js"> </script>
<script src='local/jquery.more.js'> </script>
2.Html文檔結(jié)構(gòu)
<div id="more">
<div id="vlist" class='p single_item'>
<p class='name'></p>
</div>
<a href="javascript:;" id='more_info'>::點(diǎn)擊加載更多內(nèi)容::</a>
</div>
3.Js寫(xiě)法
<script>
?$(function(){
? $("#more").more({'address':'more.php'});
?})
</script>
原理：在寫(xiě)Html代碼時(shí)不需要填充數(shù)據(jù)父晶，數(shù)據(jù)是文檔加載完成后滥搭，通過(guò)Ajax請(qǐng)求后臺(tái)，并且后臺(tái)返回?cái)?shù)據(jù)溪烤。通過(guò)Jquery.more.js文件追加到$("#more")的里面，先前寫(xiě)好的模版是隱藏掉的。需要注意的是模版中需要填充數(shù)據(jù)的標(biāo)簽的Class名要和Ajax返回?cái)?shù)據(jù)的鍵值對(duì)應(yīng)相同钝侠。
這一塊就是Jquery.more.js文件的追加部分∷嵘幔可以看出是通過(guò).key帅韧。key對(duì)應(yīng)的就是Class的名字。
?$(data).each(function() {
? ? ? ? ? ? ? ? ? ? counter++;
? ? ? ? ? ? ? ? ? ? var s = template;
? ? ? ? ? ? ? ? ? ? $.each(this, function(key, value) {
? ? ? ? ? ? ? ? ? ? ? ? if (s.find('.' + key))
? ? ? ? ? ? ? ? ? ? ? ? ? ? s.find('.' + key).html(value);
? ? ? ? ? ? ? ? ? ? });
