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>"); 将每个匹配的元素的子内容(包括文本节点)用其他结构化的标记包裹起来

      

  • 相关阅读:
    AjaxMethod js调用后台方法
    鼠标点击清空文本框 失去焦点显示提示信息
    js屏蔽BackSpace 返回上一页
    IE8标准模式打开网页
    Windows无法启动SQL server 代理服务(位于本地计算机上)错误1067:进程意外终止
    遍历枚举,添加进DropDownist
    文本框只能输入数字
    个人开发框架总结(五)
    从Power Design设计文档中提取Model
    FaibClass.WebControls控件详解(一)
  • 原文地址:https://www.cnblogs.com/shijiezhenmei/p/4343461.html
Copyright © 2011-2022 走看看