<div class="codetitle"> <span><a style="CURSOR: pointer" data="55474" class="copybut" id="copybut55474" onclick="doCopy('code55474')"><u>複製代碼</u></a></span> 代碼如下:</div> <div class="codebody" id="code55474"> <br>//W3C/1. Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <br> <br> <br><title></title> <br><style type="text/css"> <BR>.imgclass <BR>{ <BR>height:200px; <BR> width:200px; <BR>} <BR>.imgclass1 <BR>{ <BR>width:210px; height:210px; <BR>} <BR>table tr td <BR>{ <s :250px; <BR>} <BR></style> <br><script src="jquery-1.9.1.js" type="text/javascript"></script> <br><script type=" text/javascript"> <BR>$(function () { <BR>$('#Button1').click(function () { <BR>// 取得的是所有型別(tagname)為img的元素<BR>// $('img').show(3000); <BR>// $('img').hide(3000); <BR>// //取得的是所有class屬性的值為「imgclass 」的元素<BR>// $('.imgclass').hide(3000); <BR>// $('.imgclass').show(3000); <BR>// $("#img1, #img2, #Button1").hide(2000); <BR>// $("#img1, #img2, #Button1").show(2000); //一定是將所有id用一對''括起來，而不能每個id分別用引號括起來<BR>// //多個選擇器既可以是id，也可以是id，tagname和classname的混合體<BR>// $("#img1, #img2, input").hide(2000); <BR>// $("#img1, #img2, input").show(2000); <BR>//改變圖片樣式<BR>$('# Button2').click(function () { <BR>// $('#img2').removeClass();//刪除Id為img2的class樣式<BR>$('#img2').addClass(' imgclass1');//然後再增加一個樣式，再次點擊按鈕操作圖片時，由於此圖片的樣式已改，所以不發生變化<BR>}) <BR>}) <BR>}) <BR>< /script> <BR> <BR><body> <BR><table> <BR><tr><td><img alt="" id="img1" src="images/1.jpg " class="imgclass" /><td><img alt="" id="img2" src="images/2.jpg" class="imgclass" /> <BR><tr><td><img alt="" id="img3" src="images/3.jpg" class="imgclass" /><td><img alt="" id ="img4" src="images/4.jpg" class="imgclass" /> <BR><tr><td><td> <BR><input id ="Button1" type="button" value="點我啊" /> <BR><tr><td><td> <input id="Button2" type ="button" value="改變控制項樣式" /> <BR> <BR> <BR></script> </div>
