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

jQuery基础(二)—DOM篇

Aaron艾伦 Web前端工程师
难度入门
时长 2小时17分
  • 如果我们希望临时删除页面上的节点,但是又不希望节点上的数据与事件丢失,并且能在下一个时间段让这个删除的节点显示到页面,这时候就可以使用detach方法来处理 detach从字面上就很容易理解。让一个web元素托管。即从当前页面中移除该元素,但保留这个元素的内存模型对象
    查看全部
  • $("button:last").on('click', function() { //找到所有p元素中,包含了3的元素 //这个也是一个过滤器的处理 $("p").remove(":contains('3')")
    查看全部
  • 先选取整个body作为父亲,然后在创建Div元素节点 最后加入到body里面
    查看全部
  • 那个说if (!$("p").length) return删掉了也不影响这个例子的运行的朋友 这句话是当你点击bt1的时候判断p有没有长度,也就是还有没有p元素,如果没有.length为0也就是false再加!就是true直接运行return 不运行下面的p = $("p").detach() 这样会避免当你连续点两次bt1时候重复给p赋值,这时再点bt2就加不回来p了
    查看全部
  • parents()和closest()的区别 1.起始位置不同:.closest开始于当前元素 .parents开始于父元素 2.遍历的目标不同:.closest要找到指定的目标,.parents遍历到文档根元素,closest向上查找,直到找到一个匹配的就停止查找,parents一直查找到根元素,并将匹配的元素加入集合 3.结果不同:.closest返回的是包含零个或一个元素的jquery对象,parents返回的是包含零个或一个或多个元素的jquery对象
    查看全部
  • 1 .parents()和.parent()方法是相似的,但后者只是进行了一个单级的DOM树查找 2 $( "html" ).parent()方法返回一个包含document的集合,而$( "html" ).parents()返回一个空集合。
    查看全部
  • empty()所有子节点 remove()移除自身及所有子节点及绑定的事件和相关的jQuery数据 remove带参数可选择性地删除指定节点
    查看全部
  • after(),insertAfter,before(),insertBefore()外部插入 append(),appendTo(),pretend(),pretendTo()内部插入 insertBefore(),insertAfter()不支持多参数 before(),after()支持多参数
    查看全部
  • before(),after()外部插入 append(),appendTo(),pretend(),pretendTo()内部插入
    查看全部
  • before,after,是作为兄弟节点前后插; 而本节prepend prependTo是作为子节点插,prepend是上面插入;prependTo是插入到上面; append是下面插入;appendTo插入到下面。
    查看全部
  • 流程中涉及的一点方法: 创建元素:document.createElement 设置属性:setAttribute 添加文本:innerHTML 加入文档:appendChild
    查看全部
  • 遍历之each(): 封装一个遍历的方法,被称为隐式迭代的过程。要一个一个给合集中每一个li设置颜色,这里方法就是each .each() 方法就是一个for循环的迭代器,它会迭代jQuery对象合集中的每一个DOM元素。每次回调函数执行时,会传递当前循环次数作为参数(从0开始计数 所以大体上了解3个重点: each是一个for循环的包装迭代器 each通过回调的方式处理,并且会有2个固定的实参,索引与元素 each回调方法中的this指向当前迭代的dom元素 $("li").each(function(index, element) { if (index % 2) { $(this).css('color','blue') } })
    查看全部
  • add()方法:(用来创建一个新的jQuery对象 ,元素添加到匹配的元素集合中) .add()的参数可以几乎接受任何的$(),包括一个jQuery选择器表达式,DOM元素,或HTML片段引用。 处理一:传递选择器 $('li').add('p') 处理二:传递dom元素 $('li').add(document.getElementsByTagName('p')[0]) 还有一种方式,就是动态创建P标签加入到合集,然后插入到指定的位置,但是这样就改变元素的本身的排列了 3: $('li').add('<p>新的p元素</p>').appendTo(目标位置) 注意:整个结构位置都改变了,li剪切过去了
    查看全部
  • siblings():(所有同级兄弟节点) siblings()无参数 取得一个包含匹配的元素集合中每一个元素的同辈元素的元素集合 siblings()方法选择性地接受同一类型选择器表达式
    查看全部
  • prev()方法 注意:jQuery是一个合集对象,所以通过prev是匹配合集中每一个元素的上一个兄弟元素 prev()方法选择性地接受同一类型选择器表达式 同样的也是因为jQuery是合集对象,可能需要对这个合集对象进行一定的筛选,找出目标元素,所以允许传一个选择器的表达式
    查看全部

举报

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

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