zoukankan      html  css  js  c++  java
  • jQuery——Js与jQuery的相互转换

    $()与jQuery()

    jQuery中$函数,根据传入参数的不同,进行不同的调用,实现不同的功能。返回的是jQuery对象

    jQuery这个js库,除了$之外,还提供了另外一个函数:jQuery

    jQuery函数跟$函数的关系:jQuery ===$;

    jQuery与js区别

    jquery有一层功能皮肤,其内核还是js

    JS与jQuery对象之间的转换

    1、js对象转换成jquery对象。 $(js对象);

    2、jquery对象转换成js对象。 (1)jquery对象[索引值] (2)jquery对象.get(索引值)

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    <script>
        //入口函数
        jQuery(document).ready(function () {
            //js方式获取元素
            var box = document.getElementById("box");
            var cbox = document.getElementsByClassName("box");
            var div = document.getElementsByTagName("div");
            //jquery方式获取元素
            var jqbox = $("#box");
            var jqCbox = $(".box");
            var jqdiv = $("div");
            //js转换成juery转换。
            box = $(box);
            cbox = $(cbox);
            div = $(div);
            //js转换成了jquery对象,皮上面有功能可以直接调用。
            div.css({"width": 100, "height": 100, "border": "1px solid red"});
            box.css("background", "red");
            cbox.css("background", "yellow");
            //jquery对象转换成js对象
            jqdiv[0].style.backgroundColor = "black";
            jqdiv.get(4).style.backgroundColor = "pink";
        });
    </script>
    <div></div>
    <div class="box"></div>
    <div id="box"></div>
    <div class="box"></div>
    <div></div>
    </body>
    </html>
    
    

    注意事项

    1、jQuery对象是一个数组。数组中包含着原生JS中的DOM对象,还有其他特有的属性

    2、jQuery对象数组中包含的东西很多,但是jQuery对象.length依然是计算原生js中的DOM对象

  • 相关阅读:
    微软职位内部推荐-Senior SDE
    在使用Fake framework的时候,为什么有一些函数没有生产mock呢?
    Call Azure Queue get "The remote server returned an error: (400) Bad Request."
    技术分享
    IT牛人博客
    Spring-data-redis操作redis cluster
    Spring对Hibernate事务管理【转】
    Hibernate事务管理
    Redis与Memcached对比
    LockSupport的park和unpark
  • 原文地址:https://www.cnblogs.com/muyun123/p/11694652.html
Copyright © 2011-2022 走看看