zoukankan      html  css  js  c++  java
  • JQuery中的DOM操作

    1.查找节点

      使用JQuery选择器来完成

      1.1 查找元素节点

      $("ul li:eq(1)")

      1.2 查找属性节点

      var $para = $("p");

      var p_txt = $para.attr("title");

    2.创建节点

      2.1 创建元素节点

      var $li_1 = $("<li></li>");

      $("ul").append($li_1);

      2.2 创建文本节点

      var $li_1 = $("<li>香蕉</li>");

      $("ul").append($li_1);

      2.3 创建属性节点

      var $li_1 = $("<li title='香蕉'>香蕉</li>");

      $("ul").append($li_1);

    3. 插入节点

      插入节点的方法

      append() :向每个匹配元素内部追加内容

      appendTo() :将所有匹配的元素追加到指定元素中

      prepend() : 向每个匹配的元素内部前置内容 

      prependTo() : 将所有匹配的元素前置到指定的元素中

      after() : 在每个元素之后插入内容

      insertAfter() : after()相反

      before() : 在每个匹配元素之前插入内容

      insertBefore() : before()相反

    4.删除节点

      4.1 remove方法

      $("ul li:eq(1)").remove();

      $("ul li").remove("li[title!=菠萝]");

      4.2 empty方法

      $("ul li:eq(1))").empty();

    5. 复制节点

      $("ul li").click(function(){

        $(this).clone().appendTo("ul");

      })

      $(this).clone(true).appendTo("body"); 增加true,使复制的新元素具有原来的行为

      ¥(this).appendTo("body"); 移动节点

    6.替换节点

      $("p").replaceWith("<strong>text</strong>");

      $("<strong>text</strong").replaceAll("p");

    7.包裹节点

      $("strong").wrap("<b></b>");  将所有元素进行单独包裹

      $("strong").wrapAll("<b></b>"); 将所有匹配元素用一个元素来包裹

      $("strong").wrapInner("<b></b>"); 将每个匹配的元素的子内容(包括文本节点)用其他结构化的标记包裹起来

      

  • 相关阅读:
    Jenkins 的安装部署
    Python /usr/bin/python
    java学习基础 项目
    Java 并行与并发
    c# 将一个窗体显示在主窗体中
    java.io.IOException: open failed: EACCES (Permission denied) 问题解决
    android中创建模拟器的 SDCard
    Android学习笔记__2__Android工程目录结构
    Android学习笔记__3__Android应用程序组成
    Android学习笔记__1__Android体系架构
  • 原文地址:https://www.cnblogs.com/shijiezhenmei/p/4343461.html
Copyright © 2011-2022 走看看