標籤：判斷 jquery基礎 元素 tle tps 發展 改變樣式 小說 方法
目錄常見的RIA技術
架構是程式員將一個又一個功能進行封裝，供其他人使用的程式組件，瞭解為模板而已。我們使用架構是為了簡化開發進程。
jQuery庫檔案匯入：
<script src="js/jquery-1.11.3.js" type="text/javascript"></script>第一個jQuery程式jquery-1.版本號碼.js（開發版）和 jquery-1.版本號碼.min.js（發布版）
<script src="jquery-1.11.1.min.js"></script><script> $(document).ready(function(){ alert(“開啟JQuery的學習之旅！ ");});</script>練習$(document).ready()是整個啟動並執行核心。
<script type = "text/javascript"> function init(){ alert(1); alert(2); } $(document).ready(init); $().ready(init); $(init); $(document).ready(function(){ alert(11); alert(12); }); $().ready(function(){ alert(11); alert(12); }); $(function(){ alert(11); alert(22); });</script>$("h2").css("background","#08F");#id $(‘#test’) id為test.class $(“.test”) class為testelement $(‘p’) 所有的<p>* $(‘*’)選取所有的元素$(‘div span’)：選取<div>裡所有的<span>元素$(‘div > span’)：選取<div>下元素名是<span>的子項目$(‘.one + div’)：class為one的下一個<div>元素$(‘#two ~ div’)：id為two的元素後面的所有<div>兄弟元素文法特點是使用“:”
分類如下：
<div id="id#a">a</div>$("#id\\#a");<div id="id[3]">b</div>$("#id\\[3\\]");要求選取器的書寫規範很嚴格，多一個空格或少一個空格，都會影響選取器的結果。
（1）基本過濾選取器
（2）jQuery對象的click()方法
（3）jQuery對象的css()方法
（4）選取器
（5）is()方法
（6）show()方法
（7）hide()方法
（8）addClass()方法
（9）mouseout()方法
（10）mouseover()方法
代碼：
<html><head><title>基本過濾選取器</title><script type="text/javascript" src="js/jquery-1.11.1.min.js"></script></head><body><h2>使用者互動設計學習參考書</h2><ul> <li>JavaScript DOM編程</li> <li>鋒利的JQuery</li> <li>JQuery入門與提高</li> <li>JavaScript進階編程</li> <li>JQuery權威指南</li> <li>JQuery實戰</li></ul></body></html>代碼：
<html><head><title>可見度過濾選取器</title><script type="text/javascript" src="js/jquery-1.11.1.min.js"></script></head><body><p>蘿莉是什麼意思？</p><div class="tips">蘿莉是洛麗塔的縮寫。“洛麗塔”原指1955年由俄裔美國作家的小說《洛麗塔》，或指小說中的女主角12歲的洛麗塔，後在日本引申發展成一種次文化，用來表示小女孩，或用在與其相關的事物，例如羅莉塔時裝。第一個被世人公認的蘿莉角色是1982年推出的《甜甜仙子》裡的主角Momo公主。第一代蘿莉萌王是《魔卡少女櫻》裡的主角木之本櫻。</div></body></html>“ul li:odd”挑選清單ul中奇數項，用css()方法，設定背影
判斷class為tips，調用show()方法顯示，調用hide()方法隱藏
<html><head><title>基本過濾選取器</title><script type="text/javascript" src="jquery-1.10.1.js"></script><style type="text/css"> #id1{ background: blue; } #div{ width: 500px; margin: 0px auto; }</style></head><body><div id="div"><h2 id="id1">使用者互動設計學習參考書</h2> <ul> <li>JavaScript DOM編程</li> <li>鋒利的JQuery</li> <li>JQuery入門與提高</li> <li>JavaScript進階編程</li> <li>JQuery權威指南</li> <li>JQuery實戰</li> </ul></div> <script type="text/javascript"> $("#id1").click(function(){ $lis = $("ul li:odd"); $lis.css("background","#ffe773"); }); </script></body></html><script type="text/javascript"> $tips = $(".tips"); $tips.hide(); $("p").click(function(){ if ($tips.is(":hidden")) { $tips.show(); }else{ $tips.hide(); } });</script>document.getElementById("title").style.color="#f00f00";onclick單擊onmouseover滑鼠移到某元素之上onmouseout滑鼠移開onmousedown滑鼠被按下jQuery基礎與JavaScript與CSS互動-第五章
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
