• jQuery基础知识


    Javascript中的基本操作:

    <script src="jquery.min.js"></script>
    <style>
    
    #aa
    {
        width:200px;
    }
    
    </style>
    </head>
    
    <body>
    <div id="aa">hello</div>
    <div class="bb">22</div>
    <div class="bb">33</div>
    <div class="bb">44</div>
    <input type="text" name="cc" />
    
    </body>
    <script>
    var d = document.getElementById("aa");//根据ID找元素,找到是具体的DOM对象
    var c = document.getElementsByClassName("bb");
    var div = document.getElementsByTagName("div");
    var input = document.getElementsByName("cc");
    
    
    //操作内容
    //1.非表单元素
    d.innerHTML;//HTML代码    赋值d,innerHTML="";
    d.innerTEXT;//纯文本 
    
    //2.表单元素
    d.value;
    
    
    //操作属性
    d.setAttribute("bs","pp"); //添加属性
    d.getAttribute("bs");  //获取属性
    d.removeAttribute("bs"); //移除属性
    //操作样式
    d.style.color = "red";
    d.style.backgroundColor = "yellow";  //只能获取内联样式表 ,不能获取内嵌样式表和外联样式表

    jQuery中的基本操作:

    <script>
    $(document).ready(function(e) {
        
        //根据ID找元素,找出的是jQuery对象,如果要取DOM对象,取索引为0的元素
        var jd = $("#aa");//根据ID
        //alert(jd);
        var jc = $(".bb");//根据class
        var div = $("div");//根据标签名
        var ip = $("input[name=cc]"); //根据name找,利用属性选择器
        //alert(ip.eq(0)[0]);//取第几个用eq()方法
        for(var i =0;i<jc.length;i++)
        {
            jc.eq(i);//取数组里的第几个jquery对象
        }
        
        //操作内容
        //1.非表单元素
        jd.html();//取值    赋值jd.html("vv");
        jd.text(); 
    
        //2.表单元素
        jd.val();//取值     赋值jd.val("bb");
        
        
        
        //属性操作
        jd.attr("bs","aa");//设置属性
        jd.attr("bs");//获取属性
        jd.removeAttr("bs"); //移除属性
        
        
        
        //操作样式
        jd.css("background-color","#0F0"); //设置样式
        jd.css("width");  //获取样式
        
        //事件设置
        $("#aa").click(function ()  //给一个元素加事件
        {
            alert("aa");
        });
        
        
        $(".bb").click(function ()  //给多个元素加事件,设置同一个class
        {
            alert($(this).text());
        });
        
        $(".bb").css("color","#F00");; //给多个元素设置相同的样式
    });
    </script>
  • 相关阅读:
    pip install selenium==版本号 报错
    解决phantomjs输出中文乱码
    phantomjs学习之网页访问测速
    phantomjs学习之截图
    bzoj1069-最大土地面积
    hdu4372-Count the Buildings
    bzoj3786-星系探索
    Codeforces633H-Fibonacci-ish II
    hdu3625-Rooms
    斯特林数
  • 原文地址:https://www.cnblogs.com/Itwonderful/p/5489642.html
Copyright © 2020-2023  润新知