close

轉自 http://webdesign.kerthis.com/jquery/jquery_manipulation

--

jQuery 物件 → 實際 HTML DOM 元素

正如上述，取得的元素是一個 jQuery 物件，因此如果我們作下面這樣操作是會產生錯誤的：

$("#container").style.display = "none";


WHY？因為 style is not defined。(jQuery 物件沒 style 這屬性，因為它不是 DOM 物件嘛！)

 

jQuery 物件只能使用 jQuery 的方法；而 DOM 物件只能使用 DOM 物件的方法。

 

如果你想操作實際的 DOM 元素怎麼辦？ jQuery 提供下面的方法來處理這問題：

/* 轉換為真實 DOM 元素集合 */
var container = $("#container").get();
/* 取得 $(".containers") 元素集合裡的第X個 DOM 元素 get後面接的是索引值，索引值由0開始 */
var containers = $(".containers").get(0);
或，您也可以這樣
var container = $("#container")[0];


我們再來看看，可以正確執行的 Code 應該是這樣的：

$("#container").get(0).style.display = "none";

 

DOM 物件 → jQuery 物件

反過來，如果你想將 DOM 轉為 jQuery 物件，只要將 DOM 傳入「$()」:

jQuery(elements);
或
$(elements);

 

如：

$(document.getElementById("id"));

--

arrow
arrow
    全站熱搜
    創作者介紹
    創作者 dizzy03 的頭像
    dizzy03

    碎碎念

    dizzy03 發表在 痞客邦 留言(0) 人氣()

    E-mail轉寄