大家一位js中那个最繁琐呢? 我是认为dom为最,那么大家是否想要用简单的方法来实现呢? 还是用我们的jQuery
3.1 文本捕获
1.文本内容的内容操作text()
作用:获取或设置文本内容(等价于dom中的innerText属性)
2.html():获取元素中的所有内容html的标签
3.val():获取或设置表单中的值
4.Attr():获取或设置元素的属性值
3.2 元素的添加
1.Append():在元素的最后边添加内容
可以同时添加多个内容,这些内容可以是通过HTML、jquery、dom创建的
2.Prepend():在元素的最前边添加内容
可以同时删除多个内容,这些内容可以是通过HTML、jquery、dom创建的
3.after和before
两组添加的区别:
Append和prepend添加后成为了子元素
After和before添加后成为了其兄弟元素
3.3 元素的删除
Remove:删除的是该内容以及子元素
Empty:删除的是子元素。
Remove还有过滤删除的作用。可以删除指定元素,里面的参数就是制定元素的名字。
$("#btn1").click(function(){
$("p").remove(".phone");
});
这个代码的作用是:删除所有p标签中的class名为phone的元素。
3.4操作css类
里面的参数都是一样的。都是class名
1.添加class类:addClass()
2.删除class类:removeClass()
3.切换class类;toggleClass()
3.5 操作css方法
$("#p1").css("color","green")
css():需要传两个参数,第一个参数是要设置的属性名,第二个参数是属性值
$("#p1").css({"color":"green","font-size":"30px"})
也可以设置多个属性,不同属性用”,”隔开,属性名和属性值用用“:”隔开。整体使用{ }包括
3.6 尺寸
4 jQuery导航
4.1 祖先
Parent():找到的是当前元素的父元素
$("#myself").parent().css("background-color","red");
Parents找到的是当前元素的所有祖先元素
注意:如果在小括号内传入参数,就可以找到你所指定的父元素
$("#myself").parents("[name='zhang']").css("background-color","red")
ParentsUntil选中两个指定元素中的祖先元素
4.2 后代
Children:找到的是当前元素的直系后代
$("#myself").children().css("background-color","skyblue");
在小括号中传入参数,找到的是你指定的哪一个子元素
Find():找到的是所有当前元素的所有后代,一直向下查找知道找到最后一个子元素,一定要传参数
4.3 同胞
Next:找到的是当前元素的下一个弟弟元素
$("#myself").next().css("background-color","blue");
Prev:找到的是当前元素的上一个哥哥元素
$("#myself").children().css("background-color","skyblue");
Prevall:找到的是所有当前元素的哥哥元素
PrevUtil:找到的是两个指定元素之间的同胞
Sibling;找到当前元素的所有同胞元素
NextAll:找到的是当前元素的所有弟弟元素
$(".myself").nextAll().css("background-color","gray");