zoukankan      html  css  js  c++  java
  • jQuery入门基础(二):对元素的操作

    //属性操作

    html() //获取和设置html内容

    text() //获取和设置文本内容

    $(function(){
       var $strHtml=$("#divA").html();//获取divA的html内容
       $("#strHtml").html($strHtml);//把获取到的html的内容赋值给“#strHtml”
    
    })

    //操作样式

    css()

    addClass()

    $(function(){
       $("#divA").css("background-color","blue");
       $("#divB").addClass("blue");  
    })

    //追加内容

    $(html).append(content) //找到上级属性

    $(html).appendTo(content) //追加到指定元素

    $(html).appendBefore(content) //追加到指定元素前

    $(html).appendAfter(content) //追加到指定元素后

    e.g
    $(function(){
       var $content="这是追加的内容";
       $("p").append($content);  
    })

    // 复制元素

    clone()

    $(function(){
       $("body").append($("div").clone()) 
    })

    //替换元素

    $(selector).replaceWith()

    $(function(){
       $("#divA").replaceWith("替换的内容") 
    })

    //包裹元素

    wrap("")//用于包裹元素本身

    wrapInner("")//用于包裹元素中的内容

    $(function(){
       $("p").wrap("<div></div>") 
    })

    //遍历元素_对同一标记的元素实行统一操作

    $(selector).each(callback/index) //index从0开始

    $(function(){
       $("div").each(function(index){
           if(index==2) {
                $(this).addClass("red")
    }
    }) 
    })                

    //删除元素

    remove() //删除被选元素及其子元素

    empty() //删除被选元素的子元素

    $(function(){
       $("#rem").click(function(){
            $("#divA").remove();
    }) 
    })

        

  • 相关阅读:
    JZOJ 3845. 简单题(simple)
    JZOJ 3844. 统计损失(count)
    JZOJ 3843. 寻找羔羊(agnus)
    JZOJ 3833. 平坦的折线
    JZOJ 1956. 矩形
    JZOJ 3832. 在哪里建酿酒厂
    mysql 语法一 :case when详解
    阿里云推荐码
    redis配置文件详解(转)
    压力测试工具 webbench总结
  • 原文地址:https://www.cnblogs.com/Thelma/p/5822883.html
Copyright © 2011-2022 走看看