为了账号安全,请及时绑定邮箱和手机立即绑定
慕课网数字资源数据库体验端
jQuery基础(二)—DOM篇_学习笔记_慕课网
为了账号安全,请及时绑定邮箱和手机立即绑定

jQuery基础(二)—DOM篇

Aaron艾伦 Web前端工程师
难度入门
时长 2小时17分
  • 选择器.context由.find()方法实现的,所以$("li.item-li").find("li")和$("li"."li.item-li")等价。
    查看全部
  • jfe
    $("div").children(".selected") children选择的是直接子元素,可以进行元素的筛选
    查看全部
  • jfe
    e.target == this
    查看全部
  • jfe
    <script type="text/javascript"> $("button:first").on('click', function() { //删除整个 class=test1的div节点 //$(".test1").remove() $(".test1").empty() }) $("button:last").on('click', function() { //找到所有p元素中,包含了3的元素 //这个也是一个过滤器的处理 $("p").filter(":contains('3')").empty() // $("p").remove(":contains('3')") }) </script>
    查看全部
  • 创建元素:document.createElement 设置属性:setAttribute 添加文本:innerHTML 加入文档:appendChild
    查看全部
  • 创建div节点元素的属性和创建div节点元素的样式
    查看全部
  • 动态的处理节点
    查看全部
  • .each() 方法就是一个for循环的迭代器,它会迭代jQuery对象合集中的每一个DOM元素。每次回调函数执行时,会传递当前循环次数作为参数(从0开始计数
    查看全部
  • add()方法
    查看全部
  • <script type="text/javascript"> $("button:last").click(function() { //遍历所有的li //修改偶数li内的字体颜色 $("li").each(function(index, element) { if (index % 2) { $(this).css('color','blue') } // $('li:odd').css('color','blue'); }) }) each是一个for循环的包装迭代器 each通过回调的方式处理,并且会有2个固定的实参,索引与元素 each回调方法中的this指向当前迭代的dom元素
    查看全部
  • add()与append()不一样,add()是指在JQuery对象集合中增加一个对象,而append()是在DOM集合中增加一个节点。add()不会直接影响界面,append()会对界面产生影响。 例子:同时选择两个id对象 当用jQuery要选择demo1标签时,会用到下面代码:$('#demo1"); 当用jQuery选择demo1和demo2,不要告诉我用$('div')。 这时就要用到标题中提到的方法,jQuery add方法:追加标签。 代码如下 $('#demo1").add('#demo2"); add可以理解为“和”的意思
    查看全部
  • sibings找到的是所有的同辈元素,而不是相邻的前后同辈 children() 找儿子 .find() 找后代 .parent() 找爸爸 .parents() 找长辈(直接遍历到根元素,可能返回零个或一个或多个元素) .closest() 找长辈(从当前节点向上遍历,找到停止,返回零个或一个元素) .next() 找小弟 .prev() 找大哥 .siblings() 找兄弟
    查看全部
  • prev()中添加选择器, 是在这些紧邻的上一个元素集合中做出进一步筛选, 比如: eq(1), first, last, :contains("3"), has('p'),添加符合你需求的选择器来筛选 .next()和.prev()方法传入选择器,筛选的是合集中的元素而不是选择的元素
    查看全部
  • next()方法 jQuery是一个合集对象,如果想快速查找指定元素集合中每一个元素紧邻的后面同辈元素的元素集合,此时可以用next()方法
    查看全部
  • emove()和detach()可能就是其中的一个,可能remove()我们用得比较多,而detach()就可能会很少了 通过一张对比表来解释2个方法之间的不同 方法名 参数 事件及数据是否也被移除 元素自身是否被移除 remove 支持选择器表达 是 是(无参数时),有参数时要根据参数所涉及的范围 detach 参数同remove 否 情况同remove remove:移除节点 无参数,移除自身整个节点以及该节点的内部的所有节点,包括节点上事件与数据 有参数,移除筛选出的节点以及该节点的内部的所有节点,包括节点上事件与数据 detach:移除节点 移除的处理与remove一致 与remove()不同的是,所有绑定的事件、附加的数据等都会保留下来 例如:$("p").detach()这一句会移除对象,仅仅是显示效果没有了。但是内存中还是存在的。当你append之后,又重新回到了文档流中。就又显示出来了。
    查看全部

举报

0/150
提交
取消
课程须知
1、有HTML/CSS基础 2、有JavaScript基础
老师告诉你能学到什么?
1、jQuery的语法 2、jQuery节点操作
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!