首页 前端知识 Jquery-day01

Jquery-day01

2024-02-25 11:02:14 前端知识 前端哥 906 926 我要收藏

jquery是一个js工具库,它是对js的封装形成工具类。

jquery选择器:

一. jquery操作DOM

1.如何获取dom

get()获取到的是一个dom对象
                console.log($("tr").get(1));
                jquery转dom
                jq[0]
                dom转化为jquery
                $(js对象)
                console.log($($("tr").get(1)));

2.eq()

eq()获取元素匹配的第几个元素
                console.log($("tr").eq(1));

3.find()

find()查找当前元素的指定后代
                console.log($("body").find("tr"));

4.filter()

filter()查找表格身体行
                console.log($("body").find("tr").filter(function(index,ele){
                    return index>0?true:false;
                }));

5.not()

not()跟filter完全相反
                console.log($("body").find("tr").not(function(index,ele){
                    return index==0?true:false;
                }));

6.has()

has()查找包含form元素的元素
                console.log($("*").has("form"));

7.is()

is()判断表达式的结果是不是某个元素
                console.log($("#form").is("form"));

8.add()

add()连接2个结果集
                console.log($("table").add($("form")));

9.end()

//end()回退
                console.log($("*").find("tr").end());

二.jquery取值和赋值操作

1.css操作
                $("#a").css("width","200px");
                $("#a").css("height","200px");
                $("#a").css("background-color","pink");

2.attr :attr设置或者获取元素的属性
                $("#a").attr("class","aaa");

3.prop主要操作,布尔类型
                $("#b").prop("checked",false);
                $("#b").prop("checked",true);

4html设置或者获取元素内容
                $("#a").html("<span>测试</span>");

5.text设置或者获取文本内容
                $("#a").text("666");

6.length查看jquery对象的长度
                console.log($("#a").length);

7.addClass为指定标签添加类名

8.removeClass为指定标签删除类名

9.hasClass判断是否有一个类,返回值是布尔类型

10.val 获取表单元素的值
                val
                console.log($("abc").value());

11.toggleClass对多个类进行切换

 12.serialize串联表单数据

13.serializeArray串联数据为数组

转载请注明出处或者链接地址:https://www.qianduange.cn//article/2699.html
标签
评论
会员中心 联系我 留言建议 回顶部
复制成功!