1.$.boxModel
<!DOCTYPE html> <html> <head> <script src="/jquery/jquery-1.11.1.min.js"> </script> <script> var sBox = $.boxModel ? "标准W3C":"IE"; document.write("您的页面目前支持："+sBox+"盒子模型"); </script> </head> <body> </body> </html>
运行结果:
您的页面目前支持：IE盒子模型
2.$.each() 遍历
<!DOCTYPE html> <html> <head> <script src="/jquery/jquery-1.11.1.min.js"> </script> <script> var aArray = ["one", "two", "three", "four", "five"]; $.each(aArray,function(iNum,value){ //针对数组 document.write("序号:" + iNum + " 值:" + value + "<br>"); }); var oObj = {one:1, two:2, three:3, four:4, five:5}; $.each(oObj, function(property,value) { //针对对象 document.write("属性:" + property + " 值:" + value + "<br>"); }); </script> </head> <body> </body> </html>
运行结果：
序号:0 值:one 序号:1 值:two 序号:2 值:three 序号:3 值:four 序号:4 值:five 属性:one 值:1 属性:two 值:2 属性:three 值:3 属性:four 值:4 属性:five 值:5
3.$.grep()数据过滤
<!DOCTYPE html> <html> <head> <script src="/jquery/jquery-1.11.1.min.js"> </script> <script> var aArray = [2, 9, 3, 8, 6, 1, 5, 9, 4, 7, 3, 8, 6, 9, 1]; var aResult = $.grep(aArray,function(value){ return value > 4; }); document.write("aArray: " + aArray.join() + "<br>"); document.write("aResult: " + aResult.join()); </script> </head> <body> </body> </html>
运行结果：
aArray: 2,9,3,8,6,1,5,9,4,7,3,8,6,9,1
aResult: 9,8,6,5,9,7,8,6,9
4.$.map()数组转换
<!DOCTYPE html> <html> <head> <script src="/jquery/jquery-1.11.1.min.js"> </script> <script> $(function(){ var aArr = ["a", "b", "c", "d", "e"]; $("p:eq(0)").text(aArr.join()); aArr = $.map(aArr,function(value,index){ //将数组转化为大写并添加序号 return (value.toUpperCase() + index); }); $("p:eq(1)").text(aArr.join()); aArr = $.map(aArr,function(value){ //将数组元素的值双份处理 return value + value; }); $("p:eq(2)").text(aArr.join()); }); </script> </head> <body> <p></p><p></p><p></p> </body> </html>
运行结果：
a,b,c,d,e
A0,B1,C2,D3,E4
A0A0,B1B1,C2C2,D3D3,E4E4
