JQ对象与JS的转换

发布于 2021-10-18  2.3k 次阅读


JQ对象与JS的转换

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JQ对象与js的转换</title>
    <script src="../jquery-3.6.0/jquery-3.6.0.min.js"></script>
</head>
<body>
    <div id="div1">div1...</div>
    <div id="div2">div2...</div>


    <script>

        //js
        var divs = document.getElementsByTagName("div");
        alert(divs.length);
        for(var i=0;i<divs.length;i++){
            // divs[i].innerHTML="aaa";
            //3.
            (divs[i]).html("ccc");
        }
        //jQ
        vardivs = ("div");
        //对divs中的所有div内容变为"bbb" 使用JQ的方式
        //divs.html("bbb");
        divs[0].innerHTML="ddd";divs.get(1).innerHTML="eee";

    /*
        1.Jquery对象在操作时,更加方便
        2.Jquery对象与js对象方法不通用。 // divs.innerHTML="ccc";--不通用!!
        3.两者之间的转换
            * jq --> js : jq对象[索引] 或者 jq对象.get(索引)
            * js --> jq :(js对象);
    */
    </script>
</body>
</html>

态度决定高度,努力造就实力