一、处理方法
1、each方法
用来处理对象和数组的遍历
语法:
jQuery.each(array, callback ) jQuery.each( object, callback )
实例:
// 遍历数组元素,i为索引,item为值 $.each(['Brown', 'Tom'], function(i, item) { //处理元素 }); // 遍历对象属性,callback中第一个值为属性名,第二个值为属性值 $.each({ name: "张三", age: 18 }, function(property, value) { //处理元素 });
2、inArray()函数
用于在数组中搜索指定的值,并返回其索引值。如果数组中不存在该值,则返回 -1
语法:
表示返回value在数组array的索引值,fromIndex表示从哪个下标开始搜索
jQuery.inArray( value, array ,[ fromIndex ] )
实例:
$.inArray(5,[1,2,3,4,5,6,7]) //返回对应的索引:4
3、trim函数
去空格
用法:
$.trim()
实例:
$.trim(" 01234 ")//得到01234
4、get方法
get方法是获取的dom对象,也就是通过document.getElementById获取的对象(根据索引获对象)
语法:
.get( [index ] )
假如,对这个代码操作:
<div id="link"> <a>1</a> <a>2</a> <a>3</a> <a>4</a> <a>5</a> </div>
想要获取id为link的div下的第1个a标签的值
做法:
$("#link a").get(0)
注意:get方法是获取dom对象,eq方法是获取jq对象
5、index()方法
从匹配的元素中搜索给定元素的索引值,从0开始计数(根据对象获索引)
语法:
.index()//无参数的返回值就是jQuery对象中第一个元素相对于它同辈元素的位置 .index( selector )//选择器做参数 .index( element )//元素做参数
实例:
<ul> <a></a> <a></a> <li id="test1">1</li> <li id="test2">2</li> <li id="test3">3</li> </ul> $("li").index();//返回2 $("li").index(document.getElementById("test2"));//1 $("li").index($("#test2"))//1
二、Ajax网络加载
1、getJSON()方法
异步加载JSON格式数据
语法:
url:地址,
data:请求时发送的数据
callback:请求成功的回调
$.getJSON(url,[data],[callback])
实例:
$.getJSON('sport.json', function(data) { //逻辑 })
2、getScript()方法
异步加载并执行js文件
语法:
$.getScript(url,[callback])
3、get()方法
以GET方式从服务器获取数据
语法:
$.get(url,[callback])
4. post()方法
以POST方式从服务器发送数据
语法:
$.post(url,[data],[callback])
5、serialize()方法
可以将表单中有name属性的元素值进行序列化,生成标准URL编码文本字符串,直接可用于ajax请求
语法:
$(selector).serialize()
实例:
<form action=""> 姓名:<input name="Text1" type="text" size="12" /> <select name="Select1"> <option value="0">男</option> <option value="1">女</option> </select> <input name="Checkbox1" type="checkbox" />资料是否可见 </li> </form> $("form").serialize(); //值为Text1=liu&Select1=0&Checkbox1=on
6、ajax()方法(最常用)
加载服务器数据
settings为发送ajax请求时的配置对象
settings的属性:
url:请求的路径
data:请求时传递的数据
dataType:服务器返回的数据类型
success:请求成功的执行的回调函数
error:请求失败的回调函数
type:为发送数据请求的方式,默认为get
语法:
$.ajax([settings])
实例:
$.ajax({ url:"http://www.imooc.com/data/check.php", data:{ num: $("#txtNumber").val() }, dataType:"text", success: function (data) { //得到数据 alert(data); } });
7、ajaxSetup()方法
以设置Ajax请求的一些全局性选项值,设置完成后,后面的Ajax请求将不需要再添加这些选项值
语法:
$.ajaxSetup([options])
实例:
$.ajaxSetup({ type: 'POST', success:function (data) { }, error:function(data){ } }); //在这里配置了全局的配置,每一个ajax请求就不需要配置这些settting了
8、ajaxStart()和ajaxStop()方法
ajaxStart()方法用于在Ajax请求发出前触发函数,ajaxStop()方法用于在Ajax请求完成后触发函数
语法:
$(selector).ajaxStart(function()) $(selector).ajaxStop(function())
实例:
$("#divload").ajaxStart(function(){ $(this).html("正在请求数据..."); }); $("#divload").ajaxStop(function(){ $(this).html("数据请求完成!"); });
原创文章,作者:Maggie-Hunter,如若转载,请注明出处:https://blog.ytso.com/tech/pnotes/7788.html