zoukankan      html  css  js  c++  java
  • jQuery操作DOM节点

    jQuery操作DOM节点

    1、新建节点

    直接将HTML代码传人jQuery核心函数,如:newjqobj=$("<span>我是新增节点</span>");

    2、添加节点

    2.1、内部插入

    将元素添加到指定元素内部的最后 $(selector).append(newjqobj); $(selector).appendTo(oldjqobj);

    将元素添加到指定元素内部的最前面 $(selector).prepend(newjqobj); newjqobj.prependTo($(selector));

    2.2、外部插入

    将元素添加到指定元素外部的后面 $(selector).after(newjqobj); newjqobj.insertAfter($(selector));

    将元素添加到指定元素外部的前面 $(selector).before(newjqobj); newjqobj.insertBefore($(selector));

    2.3、同一个新建节点被执行多次插入操作时,以最后一次插入为准。

    3、删除节点

    3.1、删除指定元素:jqobj.remove()、jqobj.detach()

    两者都可以接受一个选择器参数,当调用者是一个集合时,用于缩小删除范围,不传参则默认删除所有方法调用者。

    两者都会返回调用方法的jQuery对象,而不是被删除的jQuery对象 利用remove删除之后再重新添加,原有的事件无法响应 利用detach删除之后再重新添加,原有事件可以响应

    3.2、删除指定元素的内容和子元素, 指定元素自身不会被删除:jqobj.empty() 没有参数和返回值。

    4、复制节点clone(true/false)

    如果传入false就是浅复制, 如果传入true就是深复制,默认值为false 浅复制只会复制元素, 不会复制元素的事件,深复制会复制元素和元素的事件

    5、替换节点

    $(selector).replaceWith(newjqobj):将$(selector)中的所有元素替换为newjqobj newjqobj.replaceAll(selector):用newjqobj替换掉所有selector匹配到的元素

  • 相关阅读:
    括号
    vue 框架原理
    Angular 1.x 框架原理
    ES5的数组方法
    js 对象细节
    《高性能网站建设进阶指南》笔记
    vue 运行时 + 编译器 vs. 只包含运行时
    vue-loader 细节
    vue 错误处理
    移动web touch事件
  • 原文地址:https://www.cnblogs.com/chuanzi/p/9459104.html
Copyright © 2011-2022 走看看