jQuery ???

jQuery ???? ??????

jQuery ???? jQuery ?????? ?? ??? ?? ? ?????. ? ????? ? ??? CSS ??? ???? ???? ??? ?? ??? ? ????. jQuery ???? ???? ?? ???? jQuery ??? ?? ?? ?????. ???? jQuery ??? ?? ??:
$(selector).methodName();
selector? DOM? ??? ??? ?? jQuery?? ???? ??? ??? ???? ???? ? ???? ??? ??????.
???? ?? jQuery? ??? ?? ??? ?????.
$(selector).method1().method2().method3();
? ?? ??? DOM?? id="goAway"? ??? ?????. class="incognito" ??? ?????.
$('#goAway').hide().addClass('incognito');
?: ??? ???? ?? ??? ???? ?? ?? ???? ???? JavaScript ?? ???? ???? ???? ??? ? ????. ?? ??? ????.
var element = $('img')[0];
???? ???? ???? ?? ? ? ?? ?? ??? ?? ??? ?????.

?? ???

1. ?? ???

jQuery ?? ???? ??? ???? ??? ?????.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>php中文網(wǎng)(php.cn)</title> 
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("p").hide();
  });
});
</script>
</head>
<body>
<h2>標題</h2>
<p>段落。</p>
<p>另一個段落。</p>
<button>點擊隱藏P標簽內(nèi)容</button>
</body>
</html>

2. #id ???

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>php中文網(wǎng)(php.cn)</title> 
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("#test").hide();
  });
});
</script>
</head>
<body>
<p>段落</p>
<p id="test">另一個段落</p>
<button>點擊隱藏id</button>
</body>
</html>

3.class ???

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>php中文網(wǎng)(php.cn)</title> 
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $(".test").hide();
  });
});
</script>
</head>
<body>
<h2 class="test">標題</h2>
<p class="test">段落。</p>
<button>點擊隱藏所有class</button>
</body>
</html>

4.element ???

p ??? ??? ??? 12px? ?????.

$(document).ready(function () {
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?>
5. * ??? $ $ (??) .Ready (?? () { // ?? ??? ?? ??? ?????? ?? ??? ????? ?????.

$ ('form *') .css('color', '#FF0000');

});

6.

$(document).ready(function () { } // p ??? ??? ?????. div ??? ??? 0? ?????. $('p, div').css('margin', ' 0');

});

?? ?? ???? ?? ???? ?? ??? ???? ?????.

??? ???? jQuery ?? ??? ???? ?? ???? ???? ?? jQuery ??? ?? ?? ????? jQuery ??? ??? .js ??? ????.

?????? jQuery? ??? ? <head> ??? ?? ??? ?????. ??? ??? ?? ??? ??? ???? ?? ? ????(src ??? ?? ?? ??):

<head>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script src="my_jquery_functions.js"></script>
</head>

???? ??

??? ??

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script> </head> <body> <script> $(document).ready(function () { $('.cube').css('background', 'pink'); }); </script> <p class="cube" style="width: 50%;">選擇器是jQuery最基礎的東西</p> <p>選擇器是jQuery最基礎的東西</p> </body> </html>

?????? ???

????