先上代碼:html
/*按需加載*/ function sendsearch() { queryString(); var url = "/xwiki/rest/wikis/xwiki/query?q="+sqlStr+"&type=hql"; var str = ""; S.one(".searchresultnum span").html("0"); S.IO.get(url,{},function(data) { // var xmlDoc = loadXMLDoc(data); var node = data.getElementsByTagName("title"); S.one(".searchresultnum span").html(node.length); if(node.length < 15) { num = node.length; S.one(".clickMore").hide(); for (var i = 0; i < num; i++) { var title = node[i].childNodes[0].nodeValue; if(title != "Search"){ str += "<li><a href='/xwiki/bin/view/人物/" + title + "'>"; str += "<img src='/xwiki/bin/download/人物/" + title + "/avaterImg.jpg'/>"; str += "<div></div></a>"; str += "<h2>" + title + "</h2>"; str += "<p class='intro'></p></li>"; } } S.one(".resultlist").html(str); S.all(".loading").remove(); } else { num = 15; S.one(".clickMore").show(); S.one(".clickMore").on("click", function() { console.log(num); if(num > node.length) { num1 = node.length; num2 = num - node.length; console.log(num1); console.log(num2); } else { num1 = num; num2 = 15; console.log(num1); console.log(num2); } for (var i = num1 - num2; i < num1; i++) { var title = node[i].childNodes[0].nodeValue; if(title != "Search"){ str += "<li><a href='/xwiki/bin/view/人物/" + title + "'>"; str += "<img src='/xwiki/bin/download/人物/" + title + "/avaterImg.jpg'/>"; str += "<div></div></a>"; str += "<h2>" + title + "</h2>"; str += "<p class='intro'></p></li>"; } } S.one(".resultlist").html(str); S.all(".loading").remove(); if(num < node.length){ num = num + 15; } else { num = 15; S.all(".clickMore").html("暫無更多內容"); } }).fire("click"); } }, "xml"); }
其中queryString()的做用就是拼接檢索條件,由於裏面涉及公司內部數據,故暫不公開,你們只要知道他的功能就能夠了。不過我仍是以爲這樣寫代碼實現是實現了,可是效率不高,正思考加入js面向對象的特性改進下。你們有什麼好的建議能夠提下。
前端
KISSY 是由阿里集團前端工程師們發起建立的一個開源 JS 框架。node
它具有模塊化、高擴展性、組件齊全,接口一致、自主開發、適合多種應用場景等特性。sql
有興趣的讀者能夠訪問他的API:http://docs.kissyui.com/前端工程師