整合營(yíng)銷服務(wù)商

          電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理

          免費(fèi)咨詢熱線:

          jQuery 如何判斷Dom對(duì)象是否存在

          jQuery 如何判斷Dom對(duì)象是否存在

          ocument 對(duì)象

          每個(gè)載入瀏覽器的 HTML 文檔或元素都會(huì)成為 Document 對(duì)象。

          Document 對(duì)象使我們可以從腳本中對(duì) HTML 頁(yè)面中的所有元素進(jìn)行訪問。


          Javascript 訪問節(jié)點(diǎn)方法:

          var oLi=document.getElementsByTagName("li");
          var oLi=document.getElementById("myHeader");
          var oLi=document.getElementsByName("myInput"); //通過(guò)name屬性訪問
          

          我們經(jīng)常要檢測(cè)一個(gè)HTML中DOM對(duì)象是否為空(或是否存在)。

          var $jObject=$('#btn');
          alert($jObject );

          我們會(huì)發(fā)現(xiàn), $jObject 永遠(yuǎn)不會(huì)為空。因?yàn)?$() 方法查找對(duì)象, 始終都會(huì)返回一個(gè)jQuery 對(duì)象的。


          解決辦法:

          首先我們就要把jQuery對(duì)象轉(zhuǎn)換成javaScritp對(duì)象。

          var dom=$jObject[0]; alert(dom);


          或者直接判斷jQuery對(duì)象的長(zhǎng)度為否為0

          包:是指有權(quán)訪問另外一個(gè)函數(shù)作用域中的變量的函數(shù).JavaScript創(chuàng)建閉包的常見方式就是在一個(gè)函數(shù)內(nèi)部創(chuàng)建另外一個(gè)函數(shù).

          JavaScript的閉包類似于Java類中使用get/set方法操作類的私有變量,JavaScript閉包是函數(shù)的嵌套,內(nèi)部的函數(shù)可以操作上一層的變量屬性,同時(shí)此函數(shù)可以被外部所調(diào)用.

          在javascript中沒有塊級(jí)作用域,一般為了給某個(gè)函數(shù)申明一些只有該函數(shù)才能使用的局部變量時(shí),我們就會(huì)用到閉包,這樣我們可以很大程度上減少全局作用域中的變量,凈化全局作用域。閉包是一種設(shè)計(jì)原則,它通過(guò)分析上下文,來(lái)簡(jiǎn)化用戶的調(diào)用,讓用戶在不知曉的情況下,達(dá)到他的目的。使用閉包有好處,也有壞處,濫用閉包會(huì)造成內(nèi)存的大量消耗。

          代碼示例

          代碼1:

          function foo(x) {

          var tmp=3;

          return function (y) {

          alert(x + y + (++tmp));

          }

          }

          var bar=foo(2); // bar 現(xiàn)在是一個(gè)閉包

          bar(10);

          代碼2:

          var add=(function () {

          var counter=0;

          return function () {return counter +=1;}

          })();

          add();

          add();

          add();

          // 計(jì)數(shù)器為 3

          代碼3:

          var App=function() {

          var isRTL=false;

          var isIE8=false;

          var isIE9=false;

          var isIE10=false;

          return {

          init: function() {},

          initAjax: function() {}

          }

          }();

          jQuery(document).ready(function() {

          App.init(); // init

          });

          apply()方法和call()方法

          1. 每個(gè)函數(shù)都包含兩個(gè)非繼承而來(lái)的方法:apply()和call()。

          2. 它們的用途相同,都是在特定的作用域中調(diào)用函數(shù)。

          3. 接收參數(shù)方面不同,apply()接收兩個(gè)參數(shù),一個(gè)是函數(shù)運(yùn)行的作用域(this),另一個(gè)是參數(shù)數(shù)組。call()方法第一個(gè)參數(shù)與apply()方法相同,但傳遞給函數(shù)的參數(shù)必須列舉出來(lái)。

          代碼示例

          代碼1:

          function sum(num1, num2) {

          return num1 + num2;

          }

          console.log(sum.call(window, 10, 10)); //20

          console.log(sum.apply(window,[10,20])); //30

          代碼2:

          window.firstName="diz";

          window.lastName="song";

          var myObject={ firstName: "my", lastName: "Object" };

          function HelloName() {

          console.log("Hello " + this.firstName + " " + this.lastName, " glad to meet you!");

          }

          HelloName.call(window); //或 .call(this);

          HelloName.call(myObject);

          運(yùn)行結(jié)果為:

          Hello diz song glad to meet you!

          Hello my Object glad to meet you!

          從示例中可以看出apply()和call()能夠擴(kuò)充函數(shù)賴以運(yùn)行的作用域

          方法的覆蓋和重寫

          JavaScript中沒有方法的重載這種概念,只有覆蓋,不管方法的參數(shù)個(gè)數(shù)多少,同名的最后一個(gè)方法會(huì)將前面的方法覆蓋掉.

          <script type="text/javascript">

          function sayHello() {

          console.log("Hello----1");

          }

          function sayHello() {

          console.log("Hello----2");

          }

          function sayHello() {

          console.log("Hello----3");

          }

          sayHello();

          </script>

          如果要實(shí)現(xiàn)重載,可采用此種方法

          <script type="text/javascript">

          function sayHi() {

          if (arguments.length==1) {

          console.log(arguments[0] + "sayHi---1");

          } else if (arguments.length==2) {

          console.log(arguments[0] + "," + arguments[1] + "sayHi---2");

          } else if (arguments.length==3) {

          console.log(arguments[0] + "," + arguments[1]+","+arguments[2] + "sayHi---3");

          }

          }

          sayHi("Tom");

          sayHi("Tom", "lucy");

          sayHi("Tom","lucy","jame");

          </script>

          回調(diào)函數(shù)

          回調(diào)函數(shù)示例

          <script language="javascript" type="text/javascript">

          // 2.傳入要回調(diào)的方法名

          function main(callBack) {

          console.log("I am main function");

          console.log("Invoke callback function..");

          // 3.參數(shù)名稱和此處的方法名稱對(duì)應(yīng)

          callBack();

          }

          function b() {

          console.log("function:b");

          }

          function c() {

          console.log("function:c");

          }

          // 1.要回調(diào)的函數(shù)作為參數(shù)

          main(b);

          main(c);

          </script>

          protocol 屬性

          定義和用法

          protocol 屬性是一個(gè)可讀可寫的字符串,可設(shè)置或返回當(dāng)前 URL 的協(xié)議。

          圖示

          代碼示例

          <script type="text/javascript">

          document.write(location.protocol);

          </script>

          輸出:

          http:

          兩個(gè)等號(hào)和三個(gè)等號(hào)的區(qū)別

          ===規(guī)則:

          1. 如果類型不同,就[不相等]

          2. 如果兩個(gè)都是數(shù)值,并且是同一個(gè)值,那么[相等];(!例外)的是,如果其中至少一個(gè)是NaN,那么[不相等]。(判斷一個(gè)值是否是NaN,只能用isNaN()來(lái)判斷)

          3. 如果兩個(gè)都是字符串,每個(gè)位置的字符都一樣,那么[相等];否則[不相等]。

          4. 如果兩個(gè)值都是true,或者都是false,那么[相等]。

          5. 如果兩個(gè)值都引用同一個(gè)對(duì)象或函數(shù),那么[相等];否則[不相等]。

          6. 如果兩個(gè)值都是null,或者都是undefined,那么[相等]。

          ==規(guī)則:

          1. 如果兩個(gè)值類型相同,進(jìn)行===比較。

          2. 如果兩個(gè)值類型不同,他們可能相等。根據(jù)下面規(guī)則進(jìn)行類型轉(zhuǎn)換再比較:

            a. 如果一個(gè)是null. 一個(gè)是undefined,那么[相等]。

            b. 如果一個(gè)是字符串,一個(gè)是數(shù)值,把字符串轉(zhuǎn)換成數(shù)值再進(jìn)行比較。

            c. 如果任一值是 true,把它轉(zhuǎn)換成 1 再比較;如果任一值是 false,把它轉(zhuǎn)換成 0 再比較。

            d. 如果一個(gè)是對(duì)象,另一個(gè)是數(shù)值或字符串,把對(duì)象轉(zhuǎn)換成基礎(chǔ)類型的值再比較。對(duì)象轉(zhuǎn)換成基礎(chǔ)類型,利用它的toString或者valueOf方法。 js核心內(nèi)置類,會(huì)嘗試valueOf先于toString;例外的是Date,Date利用的是toString轉(zhuǎn)換。非js核心的對(duì)象,令說(shuō)(比較麻 煩,我也不大懂)

            e. 任何其他組合,都[不相等]。

          其他瑣碎

          1. window.parent和window.opener

          window.parent針對(duì)frame

          window.opener針對(duì)的是打開子窗口的父窗口

          可操作響應(yīng)頁(yè)面的屬性和調(diào)用相關(guān)方法

          2. instanceof 運(yùn)算符

          在 JavaScript 中,判斷一個(gè)變量的類型嘗嘗會(huì)用 typeof 運(yùn)算符,在使用 typeof 運(yùn)算符時(shí)采用引用類型存儲(chǔ)值會(huì)出現(xiàn)一個(gè)問題,無(wú)論引用的是什么類型的對(duì)象,它都返回 “object”。

          判斷是否為數(shù)組

          if(dataList instanceof Array){}console.log(Object instanceof Object);//true

          console.log(Function instanceof Function);//true

          console.log(Number instanceof Number);//false

          console.log(String instanceof String);//false

          console.log(Function instanceof Object);//true

          console.log(Foo instanceof Function);//true

          console.log(Foo instanceof Foo);//false

          3. 判斷是否為空對(duì)象

          function isEmptyObject(obj) { for (var key in obj) { return false; } return true;}

          • 看下面的動(dòng)圖,了解一下本例最后實(shí)現(xiàn)的效果。

          attr();本身是設(shè)置標(biāo)簽屬性用的,這里用來(lái)設(shè)置樣式和獲取樣式。

          addClass();這個(gè)是追加樣式。

          removeClass();這是移除樣式。

          toggleClass();這是切換樣式,切換的意思很簡(jiǎn)單,有就刪除,沒有就追加。

          hasClass();判斷樣式是否存在。

          一、我們先做一個(gè)盒子,給它最基本的樣式,就是寬和高。

          二、忘記了,還要鏈接jQuery庫(kù),我們就連官網(wǎng)的庫(kù)吧。

          三、現(xiàn)在打開網(wǎng)頁(yè)什么都看不見,我們加個(gè)按鈕“添加紅色背景”,同時(shí)也添加一個(gè)樣式addred。

          四、現(xiàn)在可以添加按鈕的點(diǎn)擊事件了,點(diǎn)擊事件先留個(gè)空,一步一步來(lái)。

          五、接下來(lái)可以在事件里面放操作了,這里就給box追加樣式addred。

          六、后面就不啰嗦了,一口氣直接再添加三個(gè)按鈕,三個(gè)空的點(diǎn)擊事件。

          七、先試著去掉背景。

          八、忘記了,還要添加一個(gè)邊框樣式togborder。

          九、toggleClass()它是有則刪,無(wú)則加,所以稱為切換。

          十、hasClass()是判斷樣式是否存在,這里我們用alert消息框輸出結(jié)果。

          十一、忘記一個(gè)方法了,那就是attr(),再加一個(gè)按鈕,再加一個(gè)點(diǎn)擊事件。

          本文來(lái)源于,落筆承冰原創(chuàng),下面是源碼。


          主站蜘蛛池模板: 国产午夜精品一区二区三区 | 亚洲天堂一区在线| 成人精品一区久久久久| 国产精品区一区二区三| 精品一区二区三区在线播放| 国产精品被窝福利一区 | 精品一区二区三区色花堂| 国产一区二区女内射| 一区二区在线观看视频| 国产一区二区不卡老阿姨| 精品一区二区三区中文| 亚洲av一综合av一区| 国产精品一区二区三区久久| 精品一区二区91| 精品人无码一区二区三区| 日韩在线一区高清在线| 亚洲乱色熟女一区二区三区丝袜| 亚洲av综合av一区二区三区| 亚洲一区二区三区免费| 99精品国产高清一区二区麻豆| 日本精品一区二区久久久| 国产亚洲一区二区三区在线| 免费看无码自慰一区二区| 无码国产伦一区二区三区视频 | 亚洲一区二区三区高清在线观看 | 蜜桃无码AV一区二区| 人妻内射一区二区在线视频| 一区二区三区视频在线观看| 亚洲国模精品一区| 国产拳头交一区二区| 人妻视频一区二区三区免费| 久久亚洲一区二区| 日韩精品无码一区二区视频 | 国产精品xxxx国产喷水亚洲国产精品无码久久一区 | 国产中文字幕一区| 日韩成人一区ftp在线播放| AV无码精品一区二区三区| 国产精品区一区二区三在线播放 | 一区二区三区观看| 国产精品一区二区在线观看| 亚洲av日韩综合一区二区三区|