jQuery和js入口函数的差别，jquery入口函数的几种写法

最新推荐文章于 2021-05-29 20:09:35 发布

吃糖的青蛙

最新推荐文章于 2021-05-29 20:09:35 发布

阅读量1.3k

点赞数

分类专栏： jquery和js

本文链接：https://blog.csdn.net/qq_44772414/article/details/107788147

版权

jquery和js 专栏收录该内容

13 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.js">
    </script>
    <script>
        window.onload=function (ev) {
            //1.通过原生的js入口函数可以拿到DOM元素
            var img=document.getElementsByTagName("img")[0];
            console.log(img)
            //2.通过原生的js入口函数可以拿到DOM元素的宽高
            var width=window.getComputedStyle(img).width;
            console.log("js的",width)
        }
        $(document).ready(function () {
            //1.通过jQuery的入口函数可以拿到DOM元素
            var $img=$("img")[0];
            console.log($img);
            //2.通过jQuery入口函数能拿到DOM元素的宽高
            var $width=$img.width;
            console.log("jquery的",$width)
        })



        //1.原生的js如果编写了多个入口函数，后面的会覆盖前面的入口函数
        //2.jquery如果编写了多个入口函数，后面的不会覆盖前面的
        window.onload=function (ev) {
            alert("js的第一个")
        }
        window.onload=function (ev) {
            alert("js的第二个")
        }
        //2.
        $(document).ready(function () {
            alert("jquery的第一个")
        })
        $(document).ready(function () {
            alert("jquery的第二个")
        })

    </script>
</head>
<body>
<img src="https://img.alicdn.com/imgextra/i1/2959008325/TB2zh2RoRjTBKNjSZFNXXasFXXa_!!2959008325-0-beehive-scenes.jpg_180x180xzq90.jpg_.webp" alt=""/>
</body>
</html>

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.js">
    </script>
    <script>
        //1.jQuery入口函数的第一种写法
        $(document).ready(function () {
            alert("第一种写法")
        })
        //2.jQuery入口函数的第二种写法
        jQuery(document).ready(function () {
            alert("第二种写法")
        })
        //3.jQuery入口函数的第三种写法（推荐）
        $(function () {
            alert("第三种写法")
        })
        //4.jQuery入口函数的第四种写法
        jQuery(function () {
            alert("第四种写法")
        })
    </script>
</head>
<body>
</body>
</html>

在这里插入图片描述

吃糖的青蛙

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
jQuery和js入口函数的差别，jquery入口函数的几种写法

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.js"> </script> <script>
复制链接

扫一扫