1. 程式人生 > >JavaScript的DOM對象和jQuery對象的對比

JavaScript的DOM對象和jQuery對象的對比

會有 解釋 lan doctype red ava 3.1 好的 script

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>DOM對象‘&&‘jQuery對象對比</title>
    <script src="../jQuery庫/jquery-3.3.1.js"></script>
    <script>
        // DOM對象給元素div   ID="hello"加一段文字,再將字體改為紅色
        window.onload = function
(){ //獲取id為imooc1的元素div var a = document.getElementById("hello"); //改變div元素中的值 a.innerHTML="這是最佳途徑"; //改變樣式 a.style.color="red"; } //用jQuery對象給元素div ID="world"加一段文字,再將字體改為粉色 $(document).ready(function(){
//通過jQuery語法獲取id為imooc2的元素獲得一個jQuery對象 var $a = $("#world"); //調用該對象的html()方法進行更改內容,調用該對象的css()方法進行更改顏色,字體樣式 $a.html("這是好的開始!").css({ color: "pink", fontSize: "50px" }); }); </script> </head> <body> <div id="hello"></div> <div id="world"></div> </body> </html>

這段代碼會有助於區別兩種對象,代碼中有詳細的解釋!!!

JavaScript的DOM對象和jQuery對象的對比