zoukankan      html  css  js  c++  java
  • jQuery 学习过程笔记

    1:$符号表示jQuery   可以等价为$=jQuery   

    例如:   $();  ==  jQuery();

                $(function(){alert("$表示的是什么")}); ==  jQuery(function(){alert("$符号表示的就是jQuery")});

    2:DOM对象和jQuery对象的相互转化(jQuery对象不能调用DOM对象,DOM同样不能够调用jQuery对象)

    a)jQuery对象转化为DOM对象时只需调用jQuery对象的方法或者属性即可

     例如:

      $(

        function(){

          var $li =  $("li") ;// jQuery方法$("li")获得jQuery对象集合  li 数据

          var li   = $li[0] ; // 通过jQuery 对象的下标获得某个DOM对象,此时转化完成

                   //现在便可以调用li的DOM方法或属性了

      });

    b)DOM对象转化为jQuery对象,直接调用$()函数即可转化

    例如:

      $(

        function(){

          var li = document.getElementByTagNames("li"); //获取所有li集合

          var $li = $(li[0]); //直接调用$()函数转化为jQuery对象 ,这里面我们

                   //也可以直接用$()函数转化整个li数组,即:var $li = $(li);

          alert($li.html());

        }

      );

     jQuery对象不能调用DOM对象,DOM同样不能够调用jQuery对象

     例如:

    <script type="text/javascript" >
    $(function(){
      var $li = $("li");
      var li = $li.get(0);
      $li.append($("<li> new item </li>"));  //注意($("<li> new item </li>"))和$("li")的区别;
      alert(li.innerHTML);
    });
    </script>

    打印效果如图:

    • the one li
    • new item
    • the two li
    • new item
    • the thred li
    • new item

    如果我们替换红色代码为$li.get(0).append($("<li>new item</li>"));则得不到我们想要的

    结果,原因jQuery对象经过get(index)的转化后,该对象已经转化为了DOM对象,append

    为jQuery对象,所以结果不正确,另:var li = $(li[0]);同样是转化。

    注意:区分  $(li);  $li  ; $("li") 的不同含义$(li)转化,$li设置jQuery对象 ,$("li")获取li对象。

    举例说明:

    get方式转化为DOM对象

     

    下标获取方式转化为DOM方式

    DOM对象转化成jQuery对象,直接用$()方式进行转化

     3:jQuery的ready和DOM的onload方法的区别

          在没有外部文件需要加载的情况下,两者的效果一致,在有外部文件加载的时候,ready优于onload(同步性)

    解释:jQuery的ready是在DOM绘制完成之后执行的,onload则是在页面完全加载之后才执行,了解此知识需要

    了解浏览器对网页的加载顺序。不赘述(在有外部文件加载的时候用jQuery的ready(),没有两者都可以);补充

    DOM对象onload一个网页中只能被执行一次,而jQuery的ready事件可以被执行任意次($(function(){jQuery代码}))

    4:$("id") 效果等价 document.getElementById("id") 但是 功能不等价 前者有转化为jQuery对象功能,可以在$("id")

    后调用jQuery方法,而后者不能。

    //********************************未完待续****************************//

    判断一个参数是否是DOM元素

    if(doms.nodeType){

      alert("为ture则doms是DOM元素!");

    }

    判断一个参数是否是字符串

    if(typeof stringLike =="string"){

      alert("为true则stringLike是字符串类型");

    }

  • 相关阅读:
    用Python完成一个汇率转换器
    鸿蒙如何用JS开发智能手表App
    鸿蒙如何用JS开发智能手表App
    SAP Spartacus SplitViewComponent Migration 的一个具体例子
    SAP Spartacus B2B 页面 Popover Component 的条件显示逻辑
    SAP Spartacus 升级时关于 schematics 的更新
    SAP Spartacus B2B 页面 Disable 按钮的显示原理
    SAP Spartacus B2B 页面 Disable Confirmation 对话框的显示原理
    通过 Feature Level 动态控制 SAP Spartacus 的页面显示
    SAP Commerce Cloud Build Manifest Components
  • 原文地址:https://www.cnblogs.com/yangmin-78819/p/4315743.html
Copyright © 2011-2022 走看看