JavaScript的DOM對象和jQuery對象的對比
阿新 • • 發佈:2018-08-02
會有 解釋 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對象的對比