国产视频appjQuery 是一個 JavaScript 庫,極大地簡化了 JavaScript 編程。但是在 JQuery 中,有些 javascript 方法卻不能直接使用。如何解決這個問題呢?接下來就講述一下 jquery 對象和 javascript 里的dom對象之間互相轉換的方法,使 jquery 對象可以直接使用js里的方法,或 javascript 里的 dom 對象使用 jquery 里的方法.

什么是 jquery 對象

jquery對像:通常是指 jquery 選擇器選中的目標

例如以下代碼,jquery內置方法獲取的一個DOM對象

$('#mochu') 
$(".mochu")

国产视频app這種方法得到的就是 jquery 對象

注:

国产视频app1、jQuery方法若返回節點也是 jquery 對象

国产视频app2、jQuery賦值的方法返回的也是 jquery 對象

dom對象

dom對象:是 javascript 的外部對象,由瀏覽器提供的,可以直接訪問、操作整個網頁的文檔

dom文檔對象模型,用來操作文檔的;如下圖:

QQ截圖20190729110649.jpg

国产视频app例如以下代碼,得到的就是DOM對象

document.getElementById("mochu"):

對像的方法

jquery對象和dom對象是不一樣的,它們所使用的方法也不一樣,比如想要得到某個元素下的HTML內容,它們所使用的方法如下:

1、DOM對象的方法

document.getElementById("mochu").innerHTML;

2、jquery對像的方法

$("#mochu").html();

dom對象轉換為jquery對象

通常情況下,直接使用 $() 方法就可以把DOM對像轉成 jquery 對象

轉換代碼:

$(document.getElementById("mochu"))

使用方法舉例:

$(document.getElementById("mochu")).html()

jquery對象轉換成dom對象

方法1:

使用 jquery 中的內置函數 get

轉換代碼:

$('#mochu').get(0)

使用方法舉例:

$('#mochu').get(0).innerHTML;

方法2:

国产视频app因為 jquery 對象的屬性是一個數組的集合,我們可以像操作數組一樣,取出其中的一項就行了

轉換代碼

$('#mochu')[0]

使用方法舉例:

$('#mochu')[0].innerHTML;

代碼舉例說明:

<!DOCTYPE html>
<html>
<head>
    <script src="http://cdn.staticfile.org/jquery/2.2.4/jquery.min.js"></script>
</head>
<body>
<div id="mochu">
    <p>飛鳥慕魚博客</p>
</div>
<script>
    //jquery 對像方法
    console.log($('#mochu').html());
    //dom 對像的方法
    console.log(document.getElementById('mochu').innerHTML);
    //DOM對像轉JQuery對像
    console.log($(document.getElementById('mochu')).html());
    //JQuery對像轉DOM
    console.log($('#mochu').get(0).innerHTML);
    console.log($('#mochu')[0].innerHTML);
</script>
</body>
</html>

瀏覽器控制臺打印結果:

QQ截圖20190729113020.jpg

PS:以上內容收集自網絡,并由飛鳥慕魚博客整理,如有不對的地方,請留言處指正。