document.ready直接加載完dom樹便可加載,document.ready可加載多個javascript
$(document).ready(匿名函數)
css
window.onload=function(){}html
元素.方法=匿名函數 window.onload=function(){}java
注:jquery1.x版本支持IE 6/7/8;jquery-2.x以上版本再也不支持IE 6/7/8jquery
目前最新版本爲jquery-3.1.1(最新),你們能夠隨時關注官網最新版本的動態,對於初學者來講,看教程的時候,你看之前版本的教程書籍依然有用,很對新版本增長的功能對於初學者未必用得上,另你掌握了一個版本的用法以後,即便版本後續有更新,只要關注更新部分便可,不會對學習形成太大的困擾.......編程
JQuery各版本下載地址瀏覽器
基礎語法是:$(selector).action()dom
Jquery中$(document).ready()的做用相似於傳統javaScript中的window.onload方法,不過與window.onload方法仍是有區別的。ide
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>演示文檔</title> 6 <script src="jquery-3.1.1.min.js"></script> 7 <script type="text/javascript" src="ktys3.js"></script> 8 </head> 9 <body> 10 <input type="button" value="測試按鈕"> 11 <p id="p1">段落1</p> 12 <p id="p2">段落2</p> 13 <p id="p3">段落3</p> 14 <p id="p4">段落4</p> 15 <script> 16 //給元素添加事件 17 //alert($===jQuery) 18 19 // $('input').click(function(){ 20 // alert('jQuery就是這麼簡單!') 21 // }) 22 23 jQuery('input').click(function(){ 24 alert('jQuery就是這麼簡單!') 25 }) 26 jQuery('p').click(function(){ 27 jQuery(this).hide() 28 }) 29 </script> 30 31 </body> 32 </html>
1 // $('#p2').css('color','red').css('font-size','50px') 2 // window.onload=function(){ 3 // $('#p2').css('color','red').css('font-size','50px') 4 // } 5 6 // window.onload=function(){ 7 // $('#p4').css('color','red').css('font-size','50px') 8 // } 9 $(document).ready(function(){ 10 $('#p1').css('color','green').css('font-size','50px') 11 }) 12 13 $(document).ready(function(){ 14 $('#p3').css('color','green').css('font-size','50px') 15 })