JQuery —— 新建、添加、添加至某元素、属性添加、单击绑定事件

$("<nav></nav>")：创建元素

append：向当前元素中添加目标元素

appendTo：向目标元素中添加当前元素

addClass：向当前元素添加"class"属性

removeClass：删除当前元素的"class"属性

attr：向当前元素添加自定义属性

click：向当前元素添加绑定单击事件

//解析显示分页条
function build_page_nav(result){
$("#page_nav_area").empty();
var pageInfo = result.extend.pageInfo;
var navigatepageNums = pageInfo.navigatepageNums;
//page_nav_area
var ul = $("<ul></ul>").addClass("pagination");

//构建元素
var filePageLi = $("<li></li>").append($("<a></a>").append("首页").attr("href","#"));
var prePageLi = $("<li></li>").append($("<a></a>").append("«"));
if(pageInfo.hasPreviousPage == false){
filePageLi.addClass("disabled");
prePageLi.addClass("disabled");
}else{
//为元素添加分页事件
filePageLi.click(function(){
to_page(1);
});
prePageLi.click(function(){
to_page(pageInfo.pageNum-1)
});
}

var nextPageLi = $("<li></li>").append($("<a></a>").append("»"));
var lastPageLi = $("<li></li>").append($("<a></a>").append("尾页").attr("href","#"));
if(pageInfo.hasNextPage == false){
nextPageLi.addClass("disabled");
lastPageLi.addClass("disabled");
}else{
nextPageLi.click(function(){
to_page(pageInfo.pageNum+1);
});
lastPageLi.click(function(){
to_page(pageInfo.pages);
});
}

//添加首页和前一页的提示
ul.append(filePageLi).append(prePageLi);
//1,2,3遍历给ul添加页码提示
$.each(navigatepageNums,function(index,item){

var numLi = $("<li></li>").append($("<a></a>").append(item));
if(pageInfo.pageNum == item){
numLi.addClass("active");
}
numLi.click(function(){
to_page(item);
});
ul.append(numLi);
});
//添加下一页和尾页的提示
ul.append(nextPageLi).append(lastPageLi);

var navEle = $("<nav></nav>").append(ul);
navEle.appendTo("#page_nav_area");
}