欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页

03-jQuery和JS入口函数的区别

程序员文章站 2024-03-17 16:34:22
...
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>03-jQuery和JS入口函数的区别</title>
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script>
   /* window.onload = function () {
      //1.通过原生的JS入口函数可以拿到DOM元素
      var img = document.getElementsByTagName("img")[0];
      //console.log("img");
      //2.通过原生的JS入口函数可以拿到DOM元素的宽高
      var width = window.getComputedStyle(img).width;
      var height = window.getComputedStyle(img).height;
      // console.log(width);
      // console.log(height);
    }*/

    /*原生JS和jQuery入口函数加载模式不同
    原生JS会等到DOM元素加载完毕，并且图片也加载完毕后才会执行
    jQuery会等到DOM元素记载完毕，但图片没有加载完毕就会执行*/

    /*$(document).ready(function(){
      //1.通过jQuery入口函数可以拿到DOM元素
      // var $img = $('img')[0];  //两种写法
      var $img = $("img");
      console.log($img);
      //2.通过jQuery入口函数不可以拿到DOM元素的宽高
      var $width = $img.width();
      var $height = $img.height();
      console.log("jQuery",$width);
      console.log("jQuery",$height);
    });*/

    /* 1.原生JS如果编写多个入口函数，后面编写的会覆盖前面编写的入口函数
    ** 2.jQuery中编写多个入口函数，后面的不会覆盖前面
     */

   /* window.onload = function () {
      alert("woaini1");
    }
   window.onload = function () {
     alert("woaini2");
   }*/
   $(document).ready(function () {
     alert("hello1");
   });
   $(document).ready(function () {
     alert("hello2");
   });
  </script>
</head>
<body>
<img src="http://pic28.photophoto.cn/20130818/0020033143720852_b.jpg" alt="">
</body>
</html>

 

上一篇： 部署weblogic 12c时遇到的问题

下一篇：

推荐阅读