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

jQuery基础(二)—DOM篇

Aaron艾伦 Web前端工程师
难度入门
时长 2小时17分
最热 最新
  • 憨痕
    jQuery遍历之prev()方法 作用：查找紧邻的前一个兄弟元素
    查看全部
    0 采集 收起 来源：jQuery遍历之prev()方法

    2017-05-30

  • 憨痕
    jQuery遍历之next()方法 作用：查找下一个兄弟元素 例： ①$("li.item-1").next().css("border","1px solid red") ② $('.item-2').next(':first').css('border', '1px solid blue')
    查看全部
    0 采集 收起 来源：jQuery遍历之next()方法

    2018-03-22

  • 憨痕
    作用：也是祖辈查找器，但更偏向与祖辈过滤查找器 closest()方法接受一个匹配元素的选择器字符串 从元素本身开始，在DOM 树上逐级向上级元素匹配，并返回最先匹配的祖先元素 注意事项：在使用的时候需要特别注意下 粗看.parents()和.closest()是有点相似的，都是往上遍历祖辈元素，但是两者还是有区别的，否则就没有存在的意义了 ①起始位置不同：.closest开始于当前元素 .parents开始于父元素 ②遍历的目标不同：.closest要找到指定的目标，.parents遍历到文档根元素，closest向上查找，直到找到一个匹配的就停止查找，parents一直查找到根元素，并将匹配的元素加入集合 ③结果不同：.closest返回的是包含零个或一个元素的jquery对象，parents返回的是包含零个或一个或多个元素的jquery对象
    查看全部
    0 采集 收起 来源：jQuery遍历之closest()方法

    2017-05-30

  • 憨痕
    例子： <div class="div"> <ul class="son"> <li class="grandson">1</li> </ul> </div> 代码如果是$("div").find("li")，此时，li与div是祖辈关系，通过find方法就可以快速的查找到了。 .find()方法要注意的知识点： ①find是遍历当前元素集合中每个元素的后代。只要符合，不管是儿子辈，孙子辈都可以。 ②与其他的树遍历方法不同，选择器表达式对于 .find() 是必需的参数。如果我们需要实现对所有后代元素的取回，可以传递通配选择器 '*'。 ③find只在后代中遍历，不包括自己。 ④选择器 context 是由 .find() 方法实现的；因此，$('.item-ii').find('li') 等价于 $('li', '.item-ii')(找到类名为item-ii的标签下的li标签)。 注意重点： .find()和.children()方法是相似的 1.children只查找第一级的子节点 2.find查找范围包括子节点的所有后代节点
    查看全部
    0 采集 收起 来源：jQuery遍历之find()方法

    2018-03-22

  • 憨痕
    jQuery遍历之children()方法 父找子
    查看全部
    0 采集 收起 来源：jQuery遍历之children()方法

    2017-05-30

  • 憨痕
    ①.wrapAll( wrappingElement )：给集合中匹配的元素增加一个外面包裹HTML结构 例子一： <p>p元素</p> <p>p元素</p> ——> 给所有p元素增加一个div包裹 $('p').wrapAll('<div></div>') ——> 结果 2个P元素都增加了一个父div的结构 <div> <p>p元素</p> <p>p元素</p> </div> ②.wrapAll( function ) ：一个回调函数，返回用于包裹匹配元素的 HTML 内容或 jQuery 对象 通过回调的方式可以单独处理每一个元素 例子二： $('p').wrapAll(function() { return '<div><div/>'; }) ——> 以上的写法的结果如下，等同于warp的处理了 <div> <p>p元素</p> </div> <div> <p>p元素</p> </div> 注意： .wrapAll()函数可以接受任何字符串或对象，可以传递给$()工厂函数来指定一个DOM结构。这种结构可以嵌套多层，但是最内层只能有一个元素。所有匹配元素将会被当作是一个整体，在这个整体的外部用指定的 HTML 结构进行包裹。
    查看全部
    0 采集 收起 来源：DOM包裹wrapAll()方法

    2018-03-22

  • 憨痕
    ①.replaceWith( newContent )：用提供的内容替换集合中所有匹配的元素并且返回被删除元素的集合 ②.replaceAll( target ) ：用集合的匹配元素替换每个目标元素 总结： ①replaceAll()和.replaceWith()功能类似，主要是目标和源的位置区别 ②.replaceWith()与.replaceAll() 方法会删除与节点相关联的所有数据和事件处理程序 ③.replaceWith()方法，和大部分其他jQuery方法一样，返回jQuery对象，所以可以和其他方法链接使用 ④.replaceWith()方法返回的jQuery对象引用的是替换前的节点，而不是通过replaceWith/replaceAll方法替换后的节点 例子: ①$("p:eq(1)").replaceWith('<a >替换第二段的内容</a>') ②$('<a >替换第二段的内容</a>').replaceAll('p:eq(1)')
    查看全部
    0 采集 收起 来源：DOM替换replaceWith()和replaceAll()

    2018-03-22

  • 泉音
    appendTo(),prependTo(),insertBefore(),insertAfter()不支持多参数处理
    查看全部
    0 采集 收起 来源：DOM外部插入insertAfter()与insertBefore()

    2017-05-30

  • 憨痕
    remove：移除节点 ①无参数，移除自身整个节点以及该节点的内部的所有节点，包括节点上事件与数据 ②有参数，移除筛选出的节点以及该节点的内部的所有节点，包括节点上事件与数据 detach：移除节点 ①移除的处理与remove一致 ②与remove()不同的是，所有绑定的事件、附加的数据等都会保留下来 ③例如：$("p").detach()这一句会移除对象，仅仅是显示效果没有了。但是内存中还是存在的。当你append之后，又重新回到了文档流中。就又显示出来了。
    查看全部
    0 采集 收起 来源：DOM节点删除之detach()和remove()区别

    2018-03-22

  • 憨痕
    DOM节点删除之empty()的基本用法 empty 顾名思义，清空方法，但是与删除又有点不一样，因为它只移除了 指定元素中的所有子节点。
    查看全部
    0 采集 收起 来源：DOM节点删除之empty()的基本用法

    2017-05-30

  • 憨痕
    .DOM外部插入insertAfter()与insertBefore() ①insertBefore() 在目标元素前面插入几何中的每一个元素 ②insertAfter() 在目标元素后面插入几何中的每个匹配的元素
    查看全部
    0 采集 收起 来源：DOM外部插入insertAfter()与insertBefore()

    2017-05-30

  • 憨痕
    DOM内部插入prepend()与prependTo() ①prepend() 向每个匹配的元素内部前置内容 ②prependTop() 把所有匹配的元素前置到另一个指定的元素几何中 总结dom内部插入的四个方法的区别 ①append()向每个匹配的元素内部追加内容 ②prepend()向每个匹配的元素内部前置内容 ③appendTo()把所有匹配的元素追加到另一个指定元素的集合中 ④prependTo()把所有匹配的元素前置到另一个指定的元素集合中
    查看全部
    0 采集 收起 来源：DOM内部插入prepend()与prependTo()

    2017-05-30

  • 憨痕
    ①after() 在匹配元素几何中的每个元素后面插入参数所指定的内容，作为其兄弟节点 ②before() 据参数设定，在匹配元素的面前插入内容 注意： ①after向元素的后边添加html代码，如果元素后面有元素了，那将后面的元素后移，然后将html代码插入 ②before向元素的前边添加html代码，如果元素前面有元素了，那将前面的元素前移，然后将html代码插
    查看全部
    0 采集 收起 来源：DOM外部插入after()与before()

    2017-05-30

  • 憨痕
    ①append() 向每个匹配的元素内部追加内容 ②appendTo() 把所有匹配的元素追加到另一个 简单的总结就是： .append()和.appendTo()两种方法功能相同，主要的不同是语法——内容和目标的位置不同 —— append()前面是被插入的对象，后面是要在对象内插入的元素内容 —— appendTo()前面是要插入的元素内容，而后面是被插入的对象
    查看全部
    0 采集 收起 来源：DOM内部插入append()与appendTo()

    2017-05-30

  • 泉音
    DOM创建节点及节点属性 创建流程比较简单，大体如下： 创建节点(常见的：元素、属性和文本) 添加节点的一些属性 加入到文档中 流程中涉及的一点方法： 创建元素：document.createElement 设置属性：setAttribute 添加文本：innerHTML 加入文档：appendChild
    查看全部
    0 采集 收起 来源：DOM创建节点及节点属性

    2017-05-30

首页上一页154155156157158159160下一页尾页

举报

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

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

查看已购买的课程