• jQuery节点操作


    1、创建节点

      工厂函数$()用于获取或创建节点

      • $(selector):通过选这群获取节点
      • $(element):把DAM节点转化成jQuery节点
      • $(html):使用HTML字符串创建jQuery节点 
    var inputVal=$("#val").val();
    //创建节点
    var myLi=$("<li>"+inputVal+"</li>");

    2、插入节点

      

     3、插入同辈节点

      元素外部插入同辈节点

    4、替换节点、复制节点

      replaceWith()和replaceAll()用于替换节点

      clone()用于复制节点($(A).clone(true).appendTo(B);

    //替换节点
    $("li:eq(1)").replaceWith($("li:eq(4)").clone(true));
    //替换所有的节点
    myLi.replaceAll($("li"));

    注意:close()有个副作用就是会复制id,要么避免对有id的元素克隆,要么使用class代替id的作用

    5、删除节点

      jQuery提供了三种删除节点的方法

      • remove():删除整个节点
      • detach():删除整个节点,保留元素的绑定事件、附加的数据
      • empty():清空节点内容
    //HTML代码
    <p>
        Hello, <span>Person</span>
        <a href="#">and person</a>
    </p>
    // jQuery代码
    $("p"). empty();
    //结果
    <p></p>

    6、属性操作

      attr()获取或设置匹配元素的属性值

    // 获取元素的某属性的值
    $(selector).attr("属性名");
    //设置元素的属性值
    $(selector).attr("属性名","值"  );  // 设置一个属性值
    $(selector).attr( { "属性1" : "值1"  ,  "属性2" : "值2" } );  // 设置多个属性值
    
    //设置元素的属性值
    $("#val").attr({"type":"file","name":"pic"});

      removeAttr()匹配的元素中删除一个属性

    $(selector).removeAttr("属性名称");

    7、遍历子元素

      children()方法可以用来获取元素的所有子元素

    $("body").children();(获取<body>元素的子元素,但不考虑后代元素及文本节点)

    8、遍历同辈元素

      jQuery可以获取紧邻其后、紧邻其前和位于钙元素前与后的所有同辈元素

     jQuery遍历    ——each()

      以每一个匹配的元素作为上下文来执行一个函数

     $("img").each(function(i){ 
             this.src = "test" + i + ".jpg";
     });

    查找方法   ——  find()

      搜索所有与指定表达式匹配的元素

    $(“p”).find(“span”);    // 在所有p元素的后代节点中查找span元素

    9、CSS—DOM操作

      除css()外,还有获取和设置元素高度、宽度、相对位置等的样式操作方法

  • 相关阅读:
    游标、动态sql、异常
    定义declare、%TYPE%、ROWTYPE、加循环
    存储过程
    游标
    异常
    常用的sql语句(转)
    MVC的理解
    模拟struts2
    结构化分析方法
    Maven常用命令
  • 原文地址:https://www.cnblogs.com/2839888494xw/p/13208066.html
Copyright © 2020-2023  润新知