jQuery工具方法&属性

一、jQuery的$工具方法

1.$.each():遍历数组、对象、对象数组中的数据

​
//定义对象数组 [{}]
				var stus=[{"name":"aa","age":38},{"name":"bb","age":36}];
				//遍历对象数组
				$.each(stus,function(i,stu){
					// console.info(stu.name,stu.age);
					$.each(stu,function(k,v){
						console.info(v);
					})
				})

​

2.$.time():去除字符串两边的空格

var str="  zking  ";
console.info($.trim(str).length);

3.$.type(obj):得到数据的类型

//1.3 $.type()  得到变量的数据类型
				var str=12.3;
				var stu={"name":"aa","age":38};
				var stus=[{"name":"aa","age":38},"name":"bb","age":36];
				console.info($.type(stus));

4.$.isArray(obj):判断是否是数组

//1.4 $.isArray() 判断是否是数组
				var stu={"name":"aa","age":38};
				var stus=[{"name":"aa","age":38},"name":"bb","age":36];
				console.info($.isArray(stus));

5.$.isFunction(obj):判断是否是函数

//1.5 $.isFunction() 判断是否是函数
				var stus=[{"name":"aa","age":38},"name":"bb","age":36];
				console.info($.isFunction(myf));

                function myf(){
					alert(123);
				}

6.$.parseJSON(obj):解析json字符串转换为js对象/数组

//1.6 $.parseJSON() 将json格式的字符串-->js的对象数组
				var stuStr='{"name":"aa","age":38}';
				console.info($.type(stuStr));//string
				var stu=$.parseJSON(stuStr);//json格式的字符串-->js对象
				console.info($.type(stu));
				console.info(stu.name,stu.age);
				$.each(stu,function(k,v){
					console.info(v);
				})

---

二、jQuery的属性

1.attr():获取某个标签属性的值，或设置某个标签属性的值

//2.1 attr() 拿属性值/设置属性值
// 				var mpath=$("#aa").attr("src");//拿值
// 				console.info(mpath);
				//给某个属性设置值
				// $("#aa").attr("src","img/ruoj.jpg");
				// $("#aa").attr("src","200px");

2.removeAttr():删除某个标签属性

//2.2 removeAttr() 移除某个属性对应属性值
				// $("#aa").removeAttr("width");

3.addClass():给某个标签添加class属性值

//2.3 addClass() 增加样式值
				// $("#aa").addClass("xx");

4.removeClass():删除某个标签class属性值

//2.4 removeClass() 移除样式值
				// $("#aa").removeClass("xx");//class仍然在

5.prop():和attr()类似，区别在于prop用于属性值为boolean类型的情况

//给img增加name值
				// $("#aa").prop("name","abc");

案例：实现全选功能和取消全选

代码展示：

  

6.html():获取某一个标签体内容(可以包含子标签)

7.text():获取某一个标签体内容(不能包含子标签)

	//2.6 html()和text()的区别
// 				var a = $("p").html();//拿到其子标签
// 				console.info(a);
// 				var b=$("p").text();//不会拿到子标签 只会打印纯文本
// 				console.info(b);

8.val():主要用户获取/设置输入框的值

// val()拿值 设置值
				// var aa=$("#bb").val();
				// console.info(aa);

---

三、设置CSS样式

1.获取样式值：css("样式名")

2.设置单个样式:css("样式名","样式值")

3.设置多个样式:css({"样式名":"样式值","样式名":"样式值"})

//CSS
// 				$("p").css("background","#FF2925");//键,值 单个属性
// 				// $("p").css({"background":"pink","color":"blue"})//{键:值,键:值}
// 				
// 				//拿值
// 				var a=$("p").css("background");
// 				console.info(a);

效果展示：