$工具中的类方法(静态方法)
1.1 each() 遍历 数组 对象 对象数组
//数组的定义
var arr = []
var arr = new Array();
//遍历对象
$(function() {
//一、$工具方法
//1.1$.each 遍历对象 数组
//定义对象
var stu = {"name":"张三","age":38};
//遍历对象 k指的是索引 v指的是元素
$.each(stu,function(k,v){
console.info(k,v);
})
})
//遍历数组
$(function() {
//定义数组
var stus= ["张三","李四","王五","赵六"];
//遍历数组
$.each(stus,function(i,n){
console.info(n);
})
})
//遍历对象数组
$(function() {
//定义对象数组 [{}]
var stus = [{"name":"张大三","age":38},{"name":"张小三","age":39}];
//遍历对象数组
$.each(stus, function(i, stu) {
//console.info(stu.name,stu.age);
$.each(stu, function(a, b) {
console.info(b);
})
})
})
2、$.trim():去掉字符串两端的空格
$(function() {
// 1.2$.trim() 去除前后的空格
var str = " zking ";
console.info(str.length);
console.info($.trim(str).length);
})
3 type() 判断值类型
console.log($.type("hhhh"))//String
console.log($.type(jQuery))//function
4.$.isArray():判断是否是数组
$(function() {
// 1.4 $.isArray() 判断是否是数组
var stu = {"name": "张三","age": 38};
var stus = [{"name":"张大三","age":38},{"name":"张小三","age":39}];
console.info($.isArray(stu));
})
5. parseJSON() 将满足json定义的字符串转换成一个对象或者对象数组
var stu = '["aa","bb","cc"]';
// 通过parseJSON转换
var stuArr = $.parseJSON(stu)
6.isFunction() 判断是否是一个函数
console.log($.isFunction())
jQuery属性和CSS
//1.属性
//attr() 获取某个标签属性的值,或设置某个标签属性的值
//获取
console.log($("#oUl1>li:first").attr("id"))
//设置
$("#oUl1>li:first".attr("id","hh"))
//2 removeAttr() 删除某个标签属性
$("#oUl1>li:first".removeAttr("id")
//3 addClass() 给某个标签添加class属性值
$("#oUl1>li:eq(1)").addClass("demo");//demo设置的样式
//4 removeClass() 删除某个标签class属性值
$("#oUl1>li:eq(1)").removeClass("demo1");
//5 prop() 和 attr() 类似,区别在于prop用于属性值为Boolean类型的情况下
console.log($("#oUl1>li:first").prop("id"))
//6 html() 获取某一个标签体内容(该标签体中可以包含子标签)
console.log($("#sid").parent().html())
//7 text() 获取某一个标签体内容(该标签体不能包含子标签)
console.log($("#sid").parent().text())
//8 val() 获取或设置表单元素中的value值
console.log($("#sid").parent().val())
//CSS
// 获取表格中第一行tr的背景颜色
// 复合属性:有多个值(背景,是否平铺等等)
console.log($("table>tbody>tr:first").css("backgroundColor"))
//位置
offset() 获取指定标签相对整个大容器(body)的一个相对距离(top left)
console.log($("#demo3").offset().left)
console.log($("#demo3").offset().top)
position() 获取指定标签相对于父标签的位置
console.log($("#demo3>div").position().top)
console.log($("#demo3>div").position().left)
scroll() 获取滚动条被滚去的距离
$(document).scroll(function() {
console.log($(this).scrollTop());
});