楊洋瘋狂C# 刊號:201207 第1期


前言:

    將網頁上的標簽有機組合,通過JavaScript操作DOM改變標簽實現效果,通過數據庫存儲或其他手段存儲數據,實現動態網頁,實現的技術就產生了很多編程語言去實現人們想要的效果,人們很聰明也很懶,就寫了很多框架方便開發,而這些框架就需要學習了,為了實現真正的跨平台,於是產生了HTML5,為了滿足人們眼球的私欲,就產生了JS,Flash,SilverLight等為了偷懶開發,就產生了JQuery,Dojo,ExtJS等JS框架,時代在進步,手機等小型的方便的智能設備更加得到人們的青睞,於是產生了IOS,Andriod,WP7等,於是產生了很多手機應用和開發人員的那些東西,為了提高網頁效率,人們在瀏覽器上下功夫,產生了CSS3和HTML5 來替代以前JS,Flash等,就目前而言,能實現客戶想要的效果的都是好技術,目前估計CSS3和HTML5不會影響太大,未來就不一定了。網頁開發( BS )比那些桌面開發(CS)的東西要掌握的東西要多的多,考慮的問題也很多,界面要好看,用戶體驗要好,就產生UI工程師和很多新技術(例如AJAX),做動態網站的后台語言不同,就產生了,PHP,ASP.NET,JSP等行業,不同的專業知識就有很多知識你要掌握了,這輩子估計你都學不完.游戲行業又有很多知識,關於其他的,我就不想說了,總之一句話:確定你的目標,知道你需要那些知識,然后計划,最后實現它,幾年應該要的。本系列文章只作為參考和學習用,幫你引導,本人能力有限,錯誤之處還請多多包涵。目前沒有索引頁,等全部或者適當的需要的情況下會建立索引頁。

    第一期主要講一些很基礎的東西,也是后面幾期學習的基礎。鞏固自己的知識,分享自己的技術,活的會覺得很有價值~

    本期宣傳語:沒有你的允許,沒有人能叫你放棄!我會選擇堅持!

 

============================================= 目錄 ======================================

1.html篇

2.C#控制台篇

3.Asp.NET篇

4.sqlserver篇

5.JavaScript篇

6.JQuery篇

 

 

7.C# Winform篇

 

8.C# 框架篇

          --------------------------------------------------------SubSonic篇----------------------------------------------------------------------------------

         SubSnoic 框架入門到提高(1)---全程記錄

         SubSnoic 框架入門到提高(2)---全程記錄

 

 

 

 工作為主吧...還請原諒

 


 

                           ACTION   GO!            清新空氣QQ1578741102

 


 

一、 HTML篇

[掌握要求:知道w3c和一些規范等,會熟練使用盒子模型,設計盒子布局,浮動屬性等]

1.1 W3C標准

①    World Wide Web Consortium:對Web進行標准化,不是針對Web網頁制訂的標准,而是一系列標准的集合

  • 結構(Structure):內容方面:XHTML(Extension HyberText Markup Language)和XML
  • 表現(Presentation):用來美化界面,主要包括css
  • 行為(Behavior):主要包括DOM(Document Object Model)和ECMAScript等

②    DOM和ECMAScript是javascript的標准,XHTML是更嚴格更純凈的HTML版本,XHTML1.0規定了三種級別的聲明

  • Strict(嚴格類型)
  • Transitional(過渡類型)
  • Frameset(框架類型):Strict嚴格標准不允許使用框架,當頁面中需要使用框架時,則使用該聲明

③    常用組織內容的標簽:

div,span,p,h1,h2,h3,h4,h5,h6,ol,ul,li,dl-dt-dd

④      CSS:Cascading Style Sheets 層疊樣式表

在</head>標簽之上添加

<link rel="stylesheet" type="text/css" href="Style.css"/>

引入外部樣式表

⑤     JS:JavaScript

     在</head>標簽之上添加

     <script type="text/javascript" src="jquery.js"></script>

     引入外部js文件,和css引入方法很多相似,行內,內嵌,外部

⑥     XHTML規范有很多,主要基本規范

  • 標簽名和屬性名必須小寫
  • HTML標簽必須關閉
  • 屬性值必須用引號引起來
  • 標簽必須正確嵌套
  • 文檔必須有一個根元素
  • 屬性不能簡寫

⑦      Web開發注意的問題,主要以下幾點

  • 不要使用不符合W3C標准的標簽,例如<b><font><marque>,可以參考w3教程(http://w3school.com.cn)或官方文檔(http://www.w3c.org)
  • <img/>標簽必須有alt屬性值,給出圖片說明
  • 注意樣式和內容分離的原則
  • 注意表單控件name和id屬性。<form>表單推薦使用id而不是name屬性。例如<form id=”mail”…>,除單選按鈕外,控件的命名一般同事用id和name屬性,兩者取值相同。命名規范,例如userName,maxAge
  • 頁面布局盡量采用DIV+CSS布局:HTML的內容結構語義化,使用表格布局看不出語義。商業網站的二面要盡量符合搜索引擎優化(SEO),增強頁面結構層次,方便被Google,sohu,百度等搜索引擎搜索到,提高排名
  • 頁面兼容性:網頁的內容組織和樣式表現要盡量符合W3C XHTML 1.0的標准

 

符合W3C規范頁面的結構

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>無標題文檔</title>

</head>

<body>

</body>

</html>

 

 

1.2 盒子模型

 

這幅圖已經很明顯的告知了你盒子模型了。順便也告訴你margin,padding,border的用法了。

 

 

1.2.1關於頁面元素的寬度和高度的計算

 

還有一幅圖:最右邊的元素也就是最上面的顯示元素,上面的遮住下面的元素,可見背景圖片是在背景顏色上面的

 

 

理論不如實踐(初步體驗JS,CSS)

小知識:<div>獨占一行,也可以通過css屬性,使多個div在一行,<span>標簽,在一行,都可以理解成盒子,HTML中的盒子:用來容納很多HTML元素(也就是標簽)的一個邏輯整體。

注意:CSS,JS文件與頁面分開寫,必要的話也可以寫在頁面里,方便管理

本例子只是演示

附錄一(Dreamweavor快捷鍵):

文件菜單 

  新建文檔        Ctrl+N 
  打開一個 HTML文件   Ctrl+O或者將文件從[文件管理器]或[站點]窗口拖動到[文檔]窗口中 
  在框架中打開       Ctrl+Shift+O 
  關閉           Ctrl+W 
  保存 Ctrl+S 
  另存為         Ctrl+Shift+S 
  檢查鏈接        Shift + F8 
  退出          Ctrl+Q 

  編輯菜單 

  撤消          Ctrl+Z 
  重復          Ctrl+Y 或 Ctrl+Shift+Z 
  剪切          Ctrl+X 或Shift+Del 
  拷貝          Ctrl+C 或Ctrl+Ins 
  粘貼          Ctrl+V 或Shift+Ins 
  清除          Delete 
  全選          Ctrl+A 
  選擇父標簽       Ctrl+Shift+< 
  選擇子標簽       Ctrl+Shift+> 
  查找和替換       Ctrl+F 
  查找下一個       F3 
  縮進代碼         Ctrl+Shift+] 
  左縮進代碼       Ctrl+Shift+[ 
  平衡大括弧       Ctrl+’ 
  啟動外部編輯器     Ctrl+E 
  參數選擇        Ctrl+U 

  頁面視圖 

  標准視圖        Ctrl+Shift+F6 
  布局視圖        Ctrl+F6 
  工具條         Ctrl+Shift+T 

  查看頁面元素 

  可視化助理       Ctrl+Shift+I 
  標尺          Ctrl+Alt+R 
  顯示網格        Ctrl+Alt+G 
  靠齊到網格       Ctrl+Alt+Shift+G 
  頭內容         Ctrl+Shift+W 
  頁面屬性        Ctrl+Shift+J

  代碼編輯 

  切換到設計視圖     Ctrl+Tab 
  打開快速標簽編輯器   Ctrl+T 
  選擇父標簽       Ctrl+Shift+< 
  平衡大括弧       Ctrl+’ 
  全選          Ctrl+A 
  拷貝          Ctrl+C 
  查找和替換       Ctrl+F 
  查找下一個       F3 
  替換          Ctrl+H 
  粘貼          Ctrl+V 
  剪切          Ctrl+X 
  重復          Ctrl+Y 
  撤消          Ctrl+Z 
  切換斷點        Ctrl+Alt+B 
  向上選擇一行      Shift+Up 
  向下選擇一行      Shift+Down 
  選擇左邊字符      Shift+Left 
  選擇右邊字符      Shift+Right 
  向上翻頁        Page Up 
  向下翻頁        Page Down 
  向上選擇一頁      Shift+Page Up 
  向下選擇一頁      Shift+Page Down 
  選擇左邊單詞      Ctrl+Shift+Left 
  選擇右邊單詞      Ctrl+Shift+Right 
  移到行首        Home 
  移到行尾        End 
  移 動到代碼頂部     Ctrl+Home 
  移 動到代碼尾部     Ctrl+End 
  向上選擇到代碼頂部   Ctrl+Shift+Home 
  向下選擇到代碼頂部   Ctrl+Shift+End 

  編輯文本 

  創建新段落       Enter 
  插入換行               Shift+Enter 
  插入不換行空格     Ctrl+Shift+Spacebar 
  拷貝文本或對象到頁面其他位置   Ctrl+拖動選取項目到新位置 
  選取一個單詞      雙擊 
  將選定項目添加到庫   Ctrl+Shift+B 
  在設計視圖和代碼編輯器之間切換   Ctrl+Tab 
  打開和關閉[屬性]檢查器 Ctrl+Shift+J 
  檢查拼寫         Shift+F7 

  格式化文本 

  縮進          Ctrl+] 
  左縮進         Ctrl+[ 
  格式>無         Ctrl+0 (零) 
  段落格式        Ctrl+Shift+P 
  應用標題1到6到段落   Ctrl+1 到 6 
  對齊>左對齊       Ctrl+Shift+Alt+L 
  對齊>居中        Ctrl+Shift+Alt+C 
  對齊>右對齊       Ctrl+Shift+Alt+R 
  加粗選定文本      Ctrl+B 
  傾斜選定文本      Ctrl+I 
  編輯樣式表       Ctrl+Shift+E 

  查找和替換文本 

  查找          Ctrl+F 
  查找下一個/再查找    F3 
  替換          Ctrl+H

 

DreamweavorCS6中的代碼提示默認是 Ctrl+H

 

其他:在菜單欄→編輯→快捷鍵→命令→應用原格式,將原格式應用於選定內容 設置快捷鍵,常用的,我設置的是CTRL+Shift+Q  (Q代表全部)和 CTRL+Shift+E(這個我受vs的Ctrl+E+D格式化代碼影響)

Ctrl_Alt+I 插入圖片,Ctrl+Alt+F 插入Flash

在快捷鍵→編輯→代碼提示工具,將下面的快捷鍵進行修改,很常用,我都是Ctrl+Alt開頭的

下面是我的設置

 

Ctrl+U 打開首選參數設置界面

 

F12 運行網頁

根據個人能力去設置哦;

個人比較喜歡這個demo,雖然比較丑,但是幾乎融合了50%的HTML標簽,有的沒有寫在里面是因為,有的標簽很重要,想單獨舉例講

本例稍稍添加了一個css3特性  transition  單擊表單案例中的checkbox會有動畫效果。本例中的后台代碼注釋也添加了很多說明,也是自己對某些的標簽的簡短看法

1、Demo1(回憶曾經的標簽,曾經基本的):

常用標簽大回憶
  1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2 <html xmlns="http://www.w3.org/1999/xhtml">
  3 <head>
  4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5 <!--我在這里設置了網頁編碼信息,中簡:gb2312,繁體:big5,純英文iso
  6 -8859-1我想起了JAVA中的JSP亂碼-->
  7 <title>預備知識</title>
  8 <style>
  9 <!--隨便一個初體驗css3-->
 10 #ckd,#ckSport_0,#ckSport_1,#ckSport_2 {
 11     -webkit-transition: all 1s ease-in 0s;
 12     -moz-transition: all 1s ease-in 0s;
 13     -ms-transition: all 1s ease-in 0s;
 14     -o-transition: all 1s ease-in 0s;
 15     transition: all 1s ease-in 0s;
 16 }
 17 #ckd:checked,#ckSport_0:checked,#ckSport_1:checked,#ckSport_2:checked {
 18     border-color: #F0F0F0;
 19     margin-left: 50px;
 20 }
 21 
 22 </style>
 23 <!--我是注釋-->
 24 <script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
 25 </head>
 26 <body bgcolor="#999999">
 27 <!--可類比於Table,tr,td-->
 28 <div style="height:600px;width:900px"><!--內嵌樣式-->
 29   <h2>各種各樣的基本網頁標簽</h2>
 30   <!----> 
 31   <!--直接寫內容-->以下是 h+數字標題系列,可用Ctrl+數字1-6鍵
 32   ,快速輸入,選中需要的文字,按Ctrl+數字,快速給文字加標題
 33   <div>
 34     <h1>h1</h1>
 35     <h2>22</h2>
 36     <h3>h3</h3>
 37     <h4>h4</h4>
 38     <h5>h5</h5>
 39     <h6>h6</h6>
 40     <p>關於轉義符號&,輸入后有很多提示,列舉幾個:
 41       &amp;lt;是&lt;,&amp;bt;是&gt;,&amp;quot;是引號,&amp;nbsp;是空格,dw中用Ctrl+Shift+空格,打出一個以上的空格,&amp;copy;打出版權&copy;等,具體直接看提示代碼就行了,不要死記硬背</p>
 42     <p>&nbsp;</p>
 43     <p>&lt;p&gt;表示段落</p>
 44     <p><br/>
 45       &lt;br/&gt;表示換行</p>
 46     <p>&lt;img&gt; 標簽插入圖片,Ctrl+Alt+I 快速插入,flash是Ctrl+Alt+F,alt在w3c中必須要寫,規定的</p>
 47     <p>圖片align屬性,表示圖像與文本的對齊</p>
 48     <p> <img src="image/testPic.jpg" width="250" height="400" alt="我是測試圖片,我的align是middle" align="middle" border="3" />我是文字,我的左側圖片的align設置成了middle,我還可以設置top,bottom,left,right,我被直接設置了border,  HTML 4.01 不推薦使用圖像的 &quot;border&quot; 屬性。在 XHTML 1.0 Strict DTD 和 HTML 5 中,不再支持該屬性。 </p>
 49     <p>建議:
 50       &lt;img style=&quot;border:5px solid black&quot;&gt; </p>
 51     <p>插入一段flash</p>
 52     <p>
 53       <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="590" height="300" id="FlashID" title="絢爛極光">
 54         <param name="movie" value="image/58.swf" />
 55         <param name="quality" value="high" />
 56         <param name="wmode" value="opaque" />
 57         <param name="swfversion" value="8.0.35.0" />
 58         <!-- 此 param 標簽提示使用 Flash Player 6.0 r65 和更高版本的用戶下載最新版本的 Flash Player。如果您不想讓用戶看到該提示,請將其刪除。 -->
 59         <param name="expressinstall" value="Scripts/expressInstall.swf" />
 60         <!-- 下一個對象標簽用於非 IE 瀏覽器。所以使用 IECC 將其從 IE 隱藏。 --> 
 61         <!--[if !IE]>-->
 62         <object type="application/x-shockwave-flash" data="image/58.swf" width="590" height="300">
 63           <!--<![endif]-->
 64           <param name="quality" value="high" />
 65           <param name="wmode" value="opaque" />
 66           <param name="swfversion" value="8.0.35.0" />
 67           <param name="expressinstall" value="Scripts/expressInstall.swf" />
 68           <!-- 瀏覽器將以下替代內容顯示給使用 Flash Player 6.0 和更低版本的用戶。 -->
 69           <div>
 70             <h4>此頁面上的內容需要較新版本的 Adobe Flash Player。</h4>
 71             <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="獲取 Adobe Flash Player" width="112" height="33" /></a></p>
 72           </div>
 73           <!--[if !IE]>-->
 74         </object>
 75         <!--<![endif]-->
 76       </object>
 77     </p>
 78     <p>&nbsp;</p>
 79     <p>&nbsp;</p>
 80     <pre><!--在標簽內什么樣,顯示出來就什么樣,空格也方便了,哈哈,吼吼!-->
 81     hello,你好   我在學習html基礎知識 我在用&lt;pre&gt;,&lt;pre&gt;
 82          在標簽內什么樣,顯示出來就什么樣,空格也方便了,哈哈,吼吼!
 83        哈哈,吼吼!
 84 </pre>
 85     我是&lt;hr&gt;標簽
 86     &lt;hr size=&quot;5&quot; width=&quot;600&quot; color=&quot;#23530D&quot;/&gt;
 87     表示長度一般都可以用百分比表示比率
 88     <hr size="5" width="600" color="#23530D"/>
 89     <p>垂直:</p>
 90     <hr size="600" width="5" color="#23530D"/>
 91     <p>&nbsp;</p>
 92     <p>下面是個很重要的標簽,經常用於做導航欄和列表顯示數據</p>
 93     <p>無序列表&lt;ul&gt;&lt;li&gt;,他還有個類似的有序列表&lt;ol&gt;&lt;li&gt;</p>
 94     <p>無序列表 &lt;!--三個值,squre,circle,disc(默認值),也可以不顯示,無序列表,沒有顯示的順序--&gt;</p>
 95     <div>
 96       <ul type="square">
 97         <!--三個值,squre,circle,disc(默認值),也可以不顯示,無序列表,沒有顯示的順序-->
 98         <li>中國人</li>
 99         <li>韓國美女</li>
100         <li>日本男人</li>
101       </ul>
102     </div>
103     <div>
104       <ol type="1">
105         <p> 
106           <!--五個值,1(默認值)a,A,I,i,也可以不顯示,有序列表,顯示的有順序,比如數字作為標號--> 
107         </p>
108         <p>有序列表 &lt;!--五個值,1(默認值)a,A,I,i,也可以不顯示,有序列表,顯示的有順序,比如數字作為標號--&gt;</p>
109         <li>中國人</li>
110         <li>韓國美女</li>
111         <li>日本男人</li>
112       </ol>
113     </div>
114     <p> 超鏈接&lt;a href=&quot;&quot;&gt;</p>
115     <p>本頁鏈接 跳到<a href="#suggestDontUse">建議不用的標簽</a>這里</p>
116     <p>其他頁面鏈接<a href="HyberLinkTest.html">測試超鏈接</a></p>
117     <p>順便學習一下表格</p>
118     <p>&lt;!--dw中直接插入表格,輸入幾行幾列就行了,選中單元格可以行合並colspan或者列合並,cellspacing,cellpadding常被設成0,具體怎樣,嘗試一下,你就知道了,邊框看不見可以設置border=0,此處為了演示,就顯示出來,在dw中設計界面按住Ctrl不放,鼠標移到table的td中可選中TD</p>
119     <p>然后dw中界面有個屬性窗口,你可以修改他的屬性</p>
120     <table width="600" border="1" cellspacing="0" cellpadding="0" bgcolor="yellow" bordercolor="#000000" >
121       <!--dw中直接插入表格,輸入幾行幾列就行了,選中單元格可以行合並colspan或者列合並,cellspacing,cellpadding常被設成0,邊框不用可以設置border=0,此處為了演示,就顯示出來了-->
122       <tr  bgcolor="#33FF00">
123         <td>屬性值</td>
124         <td>說明</td>
125       </tr>
126       <tr>
127         <td><a href="HyberLinkTest.html" target="_blank">_blank</a></td>
128         <td>新啟動一個窗口打開鏈接</td>
129       </tr>
130       <tr>
131         <td><a href="HyberLinkTest.html" target="_self">_self</a></td>
132         <td bgcolor="#FF0000">在本窗口中打開</td>
133       </tr>
134       <tr>
135         <td><a href="HyberLinkTest.html" target="_parent">_parent</a></td>
136         <td>在上一級窗口中打開</td>
137       </tr>
138       <tr align="center"><!--相對於tr-->
139         <td><a href="HyberLinkTest.html" target="_top">_top</a></td>
140         <td>在整個瀏覽器的窗口中打開</td>
141       </tr>
142       <tr>
143         <td colspan="2">&nbsp;</td>
144       </tr>
145       <tr>
146         <td colspan="2" align="center">只是演示colspan (column span)合並列 ,還有rowspan合並行,文字居中</td>
147         <!--align可用於--> 
148       </tr>
149     </table>
150     <p>&nbsp;</p>
151     <p>關於電子郵件鏈接: <a href="mailto:1578741102@qq.com">我的郵箱</a></p>
152    
153     <div style="height:600px;width:900px;background:url(image/styl%2011.jpg)">
154       <h3>表單系列</h3>
155       <!--post安全,get不安全-->
156       <form action="HyberLinkTest.html" method="post" name="firstForm" target="_blank">
157         <!--文本框 --> 
158         文本框:
159         <input name="username" type="text" height="20" maxlength="20" />
160         <br/>
161         
162         密碼框:
163         <input name="userpwd" type="password" height="20" maxlength="20" />
164           <br/>
165         文本域:
166     <textarea  name="mark" cols="22" rows="4"></textarea>
167         <br/>
168         普通按鈕:
169         <input name="btn1" type="button" value="普通" />
170           <br/>
171              提交按鈕:
172         <input name="btn2" type="submit" value="提交" />
173               <br/>
174         重置按鈕:
175         <input name="btn3" type="reset" value="重置" />
176           <br/>
177          復選框:
178          <br/>
179         <p>
180            <label>
181              <input type="checkbox" name="ckSport" value="中國" id="ckSport_0"/>
182              中國</label>
183           <br />
184            <label>
185              <input type="checkbox" name="ckSport" value="韓國" id="ckSport_1" />
186              韓國</label>
187           <br />
188            <label>
189              <input type="checkbox" name="ckSport" value="日本" id="ckSport_2" />
190             日本</label>
191           <br />
192            <!--radio單選按鈕要同名,表示一組 -->
193            <input name="sex" type="radio" value="" checked="checked" />194             <input name="sex" type="radio" value=""  />195         </p>
196         <p>列表框
197   <!-- 加size="5" 調節select可見的選項數量,也表示列表,加上size后,加 multiple="multiple" 可以多選-->
198           <select name="birthday">
199             <option value="" selected="selected">--請選擇日期--</option>
200             <option value="1">一月</option>
201             <option value="2">二月</option>
202             <option value="3">三月</option>
203             <option value="4">四月</option>
204             <option value="5">五月</option>
205             <option value="6">六月</option>
206             <option value="7">七月</option>
207             <option value="8">八月</option>
208             <option value="9">九月</option>
209             <option value="10">十月</option>
210             <option value="11">十一月</option>
211             <option value="12">十二月</option>
212           </select>
213         </p>
214         <p>&nbsp; </p>
215         <fieldset>
216           <legend>我是&lt;fieldset&gt;標簽,&lt;legend&gt;里寫標題,相當於winform里面的groupbox</legend>
217       姓名:
218       <input type="text" />
219       密碼:
220       <input type="password" />
221   </fieldset>
222       </form>
223     </div>
224   </div>
225   <h1><a name="suggestDontUse">建議不用的標簽</a></h1>
226   <div><font color="#FF0000" face="微軟雅黑" size="+5">我是以前的&lt;font&gt;標簽,微軟雅黑,5號字</font></div>
227   <marquee>
228   我在的&lt;marquee&gt;標簽里面,我的默認方向是從右向左滾動←
229   </marquee>
230   <marquee direction="right" scrolldelay="50" >
231   我在的&lt;marquee&gt;標2簽里面,我被設置了方向是從左向右滾動→,我還有up和down
232   </marquee>
233   <marquee direction="left" scrolldelay="50" onmouseover="this.stop()" onmouseout="this.start()">
234   我在的&lt;marquee&gt;標3簽里面,鼠標移過來我停,移走我動
235   </marquee>
236 </div>
237 <div></div>
238 <script type="text/javascript">
239 swfobject.registerObject("FlashID");
240 </script>
241 </body>
242 </html>

測試連接頁面代碼

測試超鏈接等標簽的頁面
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>
</head>

<body>
<h1>超鏈接測試成功!</h1>
</body>
</html>

Demo1下載地址

 

 2、CSS修飾標簽,CSS3增強網頁元素的顯示效果(暫時不講)

   待添加

3.Dreamweavor的框架的使用 

    待添加

二、 C# 控制台篇 

對於那些基礎知識,我只能給個demo了,所有的,我要說的,都已經在代碼里了

此Demo,只要你從上往下看代碼,就能掌握C#的基本語法,代碼中含有大量vs2010操作技巧,命名規范小貼士,用代碼順便解說簡單題目,學習語法,本例也添加了很多面試題里需要注意的地方,例如String和string,值類型,引用類型,ref,out,params等。全文貫穿 C#注釋寫法,我最看好的還是,別處學也學不到的vs2010操作技巧,讓你的代碼敲得別人快

 

2.1 點兵

Demo1   (萬事開頭難,贏在起跑線)

C#基礎知識
/******************************************************   第一種注釋 
FileName(文件名):  清新空氣楊洋瘋狂學習C#系列
Copyright (版權) (c)  2011-2012 楊洋瘋狂學習C#
Writer(作者): 楊洋
create Date(創建日期): 2012-06-10
Rewriter(修改者): 楊洋
Rewrite Date(修改日期):2012-06-10
Impact(影響):
Main Content(Function Name、parameters、returns)(主要內容(函數名稱、參數、返回值))
******************************************************/

using System;        //using導入其他命名空間  第二種注釋
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.IO;

namespace CSharpChap1   //namespace指定當前文件的命名空間
{
    class Program     //所謂的類class,還有struct
    {
        static void Main(string[] args)        //C#有4中寫法,這是其中之一
        {
            #region 基本定義變量  第三種注釋
            //
            #region 值類型
            int one;  // [聲明] [變量][值類型][堆棧]
            int i = 1;  //【聲明並賦值】
            int j, k; //同時聲明同類型的兩個變量賦值
            bool boolTe = false;  //就兩個值false,true
            j = 2;
            k = 3;
            int a = 0, b = 1;//同類型的兩個變量可以一行賦值
            Console.WriteLine("i的值ToString()后的" + i.ToString() + "\n" + "沒有ToString()后的j是" + j);  //建議用ToString(),可以減少一次裝箱,【隱式轉換】【裝箱(值類型→引用類型)】,\n表示換行 類似的還有很多,例如\t,用+ 號拼接字符串
            //好長的賦值
            i = j = k = one = 100;
            #endregion

            #region 引用類型string,但我覺得她是中間者
            string stringTest1 = "";
            char charTest2 = '@';
            String upperStringTest = ""; //注意和string一模一樣,沒有任何區別,可以理解為人的一個大名一個小名,類似的還有bool,Boolean,objec和Object一樣的
            StringBuilder sb = new StringBuilder();  //new關鍵字有很多用法,其中之一
            sb.Append("第一次Append");  //sb后面的叫  方法,一個帶參數的方法,這里調用了,選中Append,按F12切換到最初定義的地方
            stringTest1 = string.Format("我在用string.Format(),方法定義string第一個字:{0},第二個字:{1},第三個字:{2}\n連在一起:{0}{1}{2}", "", "", "");
            Console.WriteLine(stringTest1);
            //同樣 Console.WriteLine(),也可以這樣定義
            Console.WriteLine("我在用string.Format(),方法定義string第一個字:{0},第二個字:{1},第三個字:{2}\n連在一起:{0}{1}{2}", "", "", "蛋C#");   //快捷鍵:cw+Tab*2  "輸入cw,按兩下tab鍵"
            #endregion

            #region if語句
            string if1 = "A";
            string if2 = "B";
            string if3 = "C";
            string if4 = "c";
            if (true)    // 快捷鍵 輸入 if + Tab*2
            {
                Console.WriteLine("是true啊!");
            }

            if (if1.Equals(if2))  //if(括號內容)   括號內容最終返回的是bool類型的
            {      //判斷是否相等
                Console.WriteLine("if1相等if2");  //相等的執行這個
            }
            else
            {
                Console.WriteLine("if1不相等if2");//不相等的執行這個
            }
            if (!(if1.Equals(if2)))  //!去條件的反  非 條件
            {      //判斷是否相等
                Console.WriteLine("if1不相等if2");//不相等的執行這個
            }
            else
            {
                Console.WriteLine("if1相等if2");  //相等的執行這個
            }

            //多個else
            if (if1.Equals(if2))
            {
                Console.WriteLine("if1相等if2");  //相等的執行這個
            }
            else if (if2.Equals(if3))
            {
                Console.WriteLine("if2相等if3");  //相等的執行這個
            }
            else
            {
                Console.WriteLine("if2跟if3不一樣,跟if1也不一樣");  //滿足條件執行這個
            }

            //if (true | false)
            //{
            //    Console.WriteLine("滿足2!       true&&true條件");  //
            //}

            if (if1.Equals(if2) && if2.Equals(if3))   //並 條件之一 我自己取名叫雙且,都為true,才為true
            {
                Console.WriteLine("if2既等於if1,也等於if3");  //
            }
            if (!(if1.Equals(if2) || if2.Equals(if3)))        //或 條件之一 我自己取名叫雙或,其中一個為true,就為true
            {
                Console.WriteLine("if2既不等於if1,也不等於if3");
            }

            //條件符號 & |
            bool x = true;
            bool y = false;   //如果 x 為 false,則不計算 y(因為不論 y 為何值,“與”操作的結果都為 false。這被稱作為“短路”計算)。
            Console.WriteLine("x&y:{0}", x & y);  //
            Console.WriteLine("x|y:{0}", x | y);  // 你可以常規理解代碼從上往下執行,從左向右執行,代碼執行到x,發現x為true,對於或運算,一個為true,全部為true,所以他后面的其他條件都不判斷了,也就不執行了。對於|| 如果從左到右,它會把每個條件都判斷完,即使有一個為true了

            //三元運算符表示條件語句 條件 ? true要執行的內容  : false要執行的內容
            string sex = true ? "" : "";
            Console.WriteLine("用三元運算符判斷出來的性別:{0}", sex);
            int userAge = 20;
            string age = userAge > 0 && userAge < 3 ? "嬰兒"
                                  : userAge > 3 && userAge < 18 ? "小孩"
                                  : userAge > 18 && userAge < 30 ? "青年"
                                  : userAge > 30 && userAge < 50 ? "壯年"
                                  : userAge > 50 && userAge < 90 ? "老人"
                                  : userAge > 90 && userAge < 200 ? "化石"
                                  : "不是人";
            Console.WriteLine("年齡是:{0},屬於{1}", userAge, age);

            //if里面嵌套if不說了,很多用法做項目會感覺到的 if(){ if(){} }

            //還有個等值判斷,switch(){}     【break,default,switch】,這種結構在簡單工廠經常用到 
            int number = 4;
            switch (number)
            {
                case 1:
                    Console.WriteLine("你的號碼是1");
                    break;        //請寫break;否則會報錯
                case 2:
                    Console.WriteLine("你的號碼是2");
                    break;        //請寫break;否則會報錯
                case 3:
                case 4:
                case 5:
                    Console.WriteLine("你的號碼等於3,4,5之間的一個數字");
                    break;        //請寫break;否則會報錯
                default:
                    Console.WriteLine("我猜不到你的數字!");
                    break;        //請寫break;否則會報錯
            }
            //switch里面的判斷條件可以是字符,字符串,bool, 快捷鍵 輸入switch + Tab*2
            Boolean switchBool = false;  //跟bool一模一樣的,將當做bool的別名吧
            switch (switchBool)
            {
                case true:
                    Console.WriteLine("true");
                    break;
                default:
                    Console.WriteLine("false");
                    break;
            }
            string switchString = "";  //為了演示string的null和"" 的區別 : null 沒有給switchString分配內存,    "" 分配了內存
            //string switchString = null; 
            switch (switchString)
            {
                case "中國":
                    Console.WriteLine("switch:  中國");
                    break;
                case "日本":
                    Console.WriteLine("switch:  日本");
                    break;
                case "韓國":
                    Console.WriteLine("switch:  韓國");
                    break;
                case "":
                    Console.WriteLine("switch: \"\"");
                    break;
                default:
                    Console.WriteLine("switch:  null");
                    break;
            }

            #endregion


            #region 循環演示
            #region while 循環演示--圖片播放
            Console.WriteLine("\n\n\n============while循環=================\n\n\n");
            int tempCount = 1;
            while (tempCount < 5)      //第一種   while(條件){循環體}    循環   //快捷鍵 while + Tab*2
            {
                Console.WriteLine("正在播放:第{0}張圖片", tempCount);
                tempCount++;    //++代表   tempCount=tempCount+1
            }
            #endregion

            #region 三顧茅廬 do while循環
            Console.WriteLine("\n\n\n============三顧茅廬演示 dowhile循環=================\n");

            int threeVisitedHouse = 1;        //劉備三顧茅廬,至少一次對吧,順便演示嵌套,continue 和  break的區別
            do           //快捷鍵 do + Tab*2        此循環的循環體至少執行一次
            {
                Console.WriteLine(Environment.NewLine + "劉備第{0}次拜訪茅廬", threeVisitedHouse);   //Environment.NewLine也表示換行
                if (threeVisitedHouse <= 2)    //不等於是 !=
                {
                    Console.Write("諸葛亮第{0}次拒絕", threeVisitedHouse);
                    threeVisitedHouse++;
                    continue;       //跳出本層循環,執行本層循環體外的代碼,例如:本例中是執行下一次的拜訪
                }
                else
                {
                    Console.WriteLine("諸葛亮說:\"好吧我跟你回蜀國!");
                    break;     //跳出本層的所有循環
                }
            } while (true);

            #endregion

            Console.WriteLine("\n\n\n============乘法口訣n*n 演示 for循環=================\n");

            int forCount = 9;
            for (int m = 1; m <= forCount; m++)             //快捷鍵 輸入for+Tab兩次
            {
                for (int n = 1; n <= m; n++)        //將光標至於變量名里或者相鄰,  快捷鍵 Ctrl + R +R 可進行快速重命名
                {
                    Console.Write("{0}×{1}={2}       ", m, n, m * n);
                }
                Console.WriteLine();
            }
            //實際開發中 for循環  非常常用

            Console.WriteLine("\n\n\n============ 演示 foreach 循環=================\n"); //用來遍歷那些實現了IEnumerable的容器類型

            #region 無聊的數組,我認為已經被集合替代了,建議用集合,而且是泛型的
            //數組的聲明方式
            // 類型[] 變量名=new 類型[長度];     類型[] 變量名=null; 類型[] 變量名;
            int[] arrayTest1 = null;
            int[] arrayTest3;
            int[] arrayTest = new int[5];
            // 類型[] 變量名=new 類型[長度]{具體值};
            arrayTest1 = new int[8] { 1, 2, 4, 7, 3, 5, 2, 11 };
            arrayTest3 = new int[] { 1, 2, 4, 7, 3, 5, 2, 11 };
            // 類型[] 變量名={具體值};  還比較常用,常見的異常:數組越界
            int[] arrayTest2 = { 2, 7, 2, 4, 83, 4, 5, 76, 4 };        //掌握這種就行了
            Console.WriteLine("數組中第一個的值:{0}", arrayTest2[0]);       //數組,集合如果索引方式獲得 都是從0開始
            //由於數組中的東西是object,所以數組中的類型也可以是個數組,這樣就產生了多維數組,由於數組的長度不一樣,
            // 就產生了什么矩形數組,鋸齒數組等,數組有幾層叫幾維
            //下面介紹一個  int[第一個數組的長度,第二個數組的長度],下面省寫,表示等長度的數組,像個矩形
            int[,] mulitArray1 = { { 1, 2, 3, 4 }, { 2, 3, 4, 5 }, { 3, 4, 5, 6 } };       //應該很好理解
            //訪問數組
            Console.WriteLine("多維數組中第1個數組中的第2個值的值:{0}", mulitArray1[0, 1]);     //正確的應該是2  {1,2,3,4}中的2
            int[, ,] mulitArray2 = {                       //應該感受到區別了吧
                                   {{1,2,3,4},{13,22,13,44},{1,5,3,4},{13,25,13,44}},
                                   {{1,2,13,4},{17,22,13,44},{1,2,23,4},{13,22,13,34}},
                                   {{1,12,3,4},{93,22,13,44},{1,2,13,4},{13,22,13,34}}
                                   };
            Console.WriteLine("三維數組中第二個數組里面第三個數組中的第三個數是:{0}", mulitArray2[1, 2, 2]);     //正確的應該是23  第二行里面第三個數組中的第三個數
            //多維數組自己可以參考msdn學習

            //下面正題,foreach    //快捷鍵 輸入foreach+Tab兩次,本例對arrayTest2數組求和
            //快捷鍵后默認有個var類型,可和js中作類比,再此不多說
            int sumNumber = 0;
            foreach (int c in arrayTest2)
            {
                sumNumber += c;
            }
            Console.WriteLine("arrayTest2累加的和是:{0}", sumNumber);

            #endregion

            //注釋的快捷鍵 選中代碼,按Ctrl+E+C,取消注釋Ctrl+E+U,或者不選中某一行,把光標置於某行前面,按快捷鍵,可快速注釋
            Console.WriteLine("\n\n\n============ 演示冒泡排序================\n"); //排序對程序很重要,方法也有很多,本例就對目前所掌握的知識進行一個總結,對arrayTest2數組排序
            int temp = 0;//為排序做中間變量
            for (int outLayer = 0; outLayer < arrayTest2.Length - 1; outLayer++)      //Length是數組的長度,注意L大寫, 外層循環 數組長度-1    ,控制比較的輪數
            {
                for (int innerLayer = 0; innerLayer < arrayTest2.Length - 1 - outLayer; innerLayer++)  //內部循環 數組長度-1-外層索引
                {
                    //把大數字放在后面
                    if (arrayTest2[innerLayer] > arrayTest2[innerLayer + 1])
                    {
                        //temp = arrayTest2[innerLayer];                 //先把大數字放在臨時變量里
                        //arrayTest2[innerLayer] = arrayTest2[innerLayer + 1];  //注意:數組中的 [索引]   索引越小,數字越靠前面,所以將小數字賦值到前面的一個變量(比較大小的對手)去 
                        //arrayTest2[innerLayer + 1] = temp;   //將臨時變量的(較大的那個數,放在數組中較后面的位置,供下一周的比較)
                        //也可以不用臨時變量交換兩個數字的位置
                        arrayTest2[innerLayer] = arrayTest2[innerLayer] + arrayTest2[innerLayer + 1];
                        arrayTest2[innerLayer] = arrayTest2[innerLayer] - arrayTest2[innerLayer + 1];
                        arrayTest2[innerLayer + 1] = arrayTest2[innerLayer] - arrayTest2[innerLayer + 1];
                        //按住Alt選擇代碼,會有意想不到的代碼哦,試試吧
                        #region 交換位置的一個小算法
                        //int aa = 9;
                        //int bb = 10;
                        //aa = aa + bb;
                        //bb = aa - bb;
                        //aa =  aa - bb;
                        //Console.WriteLine(aa+"  "+bb); 
                        #endregion
                    }
                }
            }
            //數組排序好了,進行輸出
            Console.WriteLine("排序后的數字:");
            foreach (int item in arrayTest2)
            {
                Console.Write(item.ToString() + ",");
            }
            //要比較的輪數=  數組長度-1   ;   
            //第n輪比較,每輪比較的周數=數組長度-n+1 ;(其中>數組長度>n>0)
            //一共比較多少次,這個用排列組合知識比較簡單, C的右下角是數組長度+1,右上角是2   得到結果后再減去1
            #endregion

            #endregion

            #region 值類型,引用類型對比,目前基礎課不重要,以后非常重要
            bool boolTest;
            bool boolTest2 = false;
            boolTest = boolTest2;
            boolTest = true;
            Console.WriteLine("boolTest1:{0}\tboolTest2:{1}", boolTest.ToString(), boolTest2.ToString());

            string wifeLi = "我的老公是Zhang";
            string husbandZhang = "我的老婆是Li";
            Console.WriteLine("\n\n\nwifeLi:{0}\nhusbandZhang:{1}", wifeLi, husbandZhang);
            Console.WriteLine("\n===========結婚一年后===========\n");
            wifeLi = husbandZhang;
            husbandZhang = "我變心了,不喜歡你了";
            Console.WriteLine("wifeLi:{0}\thusbandZhang:{1}", wifeLi, husbandZhang);
            wifeLi = "我也變心了,我根本不喜歡你";
            Console.WriteLine("wifeLi:{0}\thusbandZhang:{1}", wifeLi, husbandZhang);

            //表示引用關系,而不是他的副本,於是提出了深復制,淺復制,這個以后再說
            StringBuilder wifeQin = new StringBuilder("我的老公是Wang");
            StringBuilder husbandWang = new StringBuilder("我的老婆是Qin");
            Console.WriteLine("\n\nwifeQin:{0}\thusbandWang:{1}", wifeQin, husbandWang);
            Console.WriteLine("\n===========結婚一年后===========\n");
            wifeQin = husbandWang;
            husbandWang.Clear();
            husbandWang.Append("我變心了,不喜歡你了");
            Console.WriteLine("wifeQin:{0}\thusbandWang:{1}", wifeQin, husbandWang);
            wifeQin.Clear();
            wifeQin.Append("我也變心了,我根本不喜歡你");
            Console.WriteLine("wifeQin:{0}\thusbandWang:{1}", wifeQin, husbandWang);

            //Ctrl+E+D  格式化一下代碼
            #endregion

            #region 下面就 C#中方法的參數可以有幾種傳遞方式 說一下
            Console.WriteLine("\n\n\n============ref,out,params方法參數修飾關鍵字=================\n\n\n");
            //方法中的參數 關鍵字  ref out param,一共有2個,ref,out都實現了參數的引用傳遞,區別在於ref要求參數在傳入前被初始化,而out要求參數在方法返回前被初始化
            //params實現了參數數目可變的方法
            //順便學習,目標:會定義方法,知道這幾個關鍵字用法,了解引用和值類型,方法簽名,方法重載
            //方法簽名=返回類型 方法名(參數列表)
            //方法的定義 訪問修飾符 方法簽名{  }

            int refTest = 0;
            Console.WriteLine("初始值:" + refTest.ToString());
            NotRefMethod(refTest);
            Console.WriteLine("通過非引用傳遞參數后的結果:" + refTest.ToString());
            RefMethod(ref refTest); //雖然調用了方法,但還是改變了原有的值,因為這里的參數已經加ref變成引用類型了,RefMethod里的parameter在堆棧里已經指向了refTest,就好比他倆不同名字,但是同一個人,修改其中一個,另一個也就會變
            Console.WriteLine("通過ref引用傳遞參數后的結果:" + refTest.ToString());
            int outTest;  //僅僅聲明,沒有值
            OutMethod(out outTest);
            Console.WriteLine("通過out引用傳遞參數后的結果:" + outTest.ToString()); //奇怪的是outTest有值了,這就是out的作用
            //下面介紹一下params
            Console.WriteLine("\n\n\n============params方法參數修飾關鍵字=================\n\n\n");
            string param1 = "以下是清新空氣的基本信息(身高,體重)";
            double param2 = 1.78;
            int param3 = 100;
            //params作為方法的修飾參數的好處,可直接將所有變量集合傳入,無需聲明一個數組對象
            UseParams(param1, param2, param3);
            //沒有params,需要先建立一個數組
            object[] objCollection = { param1, param2, param3 };
            NotUseParams(objCollection);    //翻代碼累了,定位代碼3種方式①光標置於方法名,按F12,②Ctrl+G,然后輸入行號③網上有vs2010插件

            #endregion

            #region 常用的知識,類型轉換 Convert.ToXX(),字符串的基本處理
            Console.WriteLine("\n\n\n============  常用的知識,類型轉換 Convert.ToXX(),字符串的基本處理=================\n");
            //目標:掌握數字間基本轉換,字符串處理
            //string exampleConvert = "19";
            //經常做表單時遇到 擔心別人輸入的不是數字,有很多方法解決
            //①try{}catch(){}finally{} 順便學習一下異常處理,更多詳細,網上有講解,多重catch時必須從子類到父類的寫,否則編譯不通過 【繼承】
            Console.WriteLine("我來學你說話.請輸入:");
            string text = Console.ReadLine(); //讓用戶可以再控制台輸入東西,作為程序執行下一步的判斷條件等等
            Console.WriteLine("你剛才輸入的是:{0}", text);
            Console.WriteLine("你要我對你說什么? 1.我愛你  2.我喜歡你 3.其實我不是人\n請輸入數字選擇:");
            try
            {
                int choice = int.Parse(Console.ReadLine());
                switch (choice)
                {
                    case 1:
                        Console.WriteLine("我愛你");
                        break;
                    case 2:
                        Console.WriteLine("我喜歡你");
                        break;
                    case 3:
                        Console.WriteLine("其實我不是人");
                        break;
                    default:
                        Console.WriteLine("你說什么?我聽不懂。");
                        break;
                }
            }
            catch (Exception ex)
            {
                Console.WriteLine("請輸入數字進行選擇!");
                //Console.WriteLine(ex.Message); //這里只是為了說明調試技巧:用Message屬性可以輸出錯誤信息,方便調試:常用的,解決不了,將錯誤信息粘貼到網上去查找解決辦法
                //Console.WriteLine(ex.StackTrace); //輸出堆棧中的錯誤信息
                return; //程序到這里不執行下面的代碼了,很常用
            }

            //第二種也是很保險的一個方法,推薦的,
            Console.WriteLine("\n\n你還要我對你說什么? 1.我愛你  2.我喜歡你 3.其實我不是人\n請輸入數字選擇:");
            int tryparseChoice; //不要賦值
            string text2 = Console.ReadLine();
            if (int.TryParse(text2, out tryparseChoice))   //應該還記得吧  out,試圖將字符串轉換為int,成功的話 tryparseChoice就被賦值了,否則賦值失敗,if里的條件也就是false了,但不會報異常的
            {
                switch (tryparseChoice)
                {
                    case 1:
                        Console.WriteLine("我愛你");
                        break;
                    case 2:
                        Console.WriteLine("我喜歡你");
                        break;
                    case 3:
                        Console.WriteLine("其實我不是人");
                        break;
                    default:
                        Console.WriteLine("你說什么?我聽不懂。");
                        break;
                }
            }
            else
            {
                Console.WriteLine("請輸入數字進行選擇!");
            }

            //通過tryparse系列方法,和parse方法,是將字符串轉換成其他類型的方法
            //真正常用的還有 Convert.ToXXX系列的方法,他可以將M類型,轉換成N類型,轉換的條件當然要是合理,希望不要鑽字眼
            //例如
            double stringToDouble = Convert.ToDouble("12.15");  //此類型語句,在ado.net中經常用,數據庫中讀的一般都是string類型的
            Console.WriteLine("stringToDouble現金是{0:C}", stringToDouble);  //這里用到了{0:C} 格式化字符串
            double intToDouble = Convert.ToInt32(12);
            Console.WriteLine("intToDouble現金是{0:C}", intToDouble);  //這里用到了{0:C} 格式化字符串
            Console.WriteLine("\n\n\n============ 字符串的基本處理=================\n");
            //關於string字符串的某些方法
            string testWord = "我是生活在空氣里的空氣Yangyang!";
            Console.WriteLine("原句子:{0}", testWord);
            Console.WriteLine("testWord.Substring(0,2)  >> {0}",
                testWord.Substring(0, 2)        //敲代碼的時候就有提示了,第一個參數是起始點,第二個指要截取的長度 →我是
                );
            Console.WriteLine("testWord.Substring(3)   >> {0}",
           testWord.Substring(3)        //→活在空氣里的空氣Yangyang!從0開始數,3正好在活上面,然后取到尾部,呵呵,我已開始,用手指只在上面數,從左往右→從0開始數,最后停在那個字符上,就是最后手指壓着的那個字符開始截取
           );
            Console.WriteLine("testWord.testWord.IndexOf(\"空氣\")    >> {0}",
          testWord.IndexOf("空氣")        //→5!從0開始數 左→右 先停下的那個字符,后面的重復的不管
          );
            Console.WriteLine("testWord.testWord.LastIndexOf(\"空氣\")    >> {0}",
         testWord.LastIndexOf("空氣")        //→9!從0開始數 左→右, 在最后1個指定的字符停下,前面的重復的不管
   );
            Console.WriteLine("testWord.testWord.ToUpper()    >> {0}",
testWord.ToUpper()        //→我是生活在空氣里的空氣YANGYANG! 轉換成大寫,同理還有ToLower()等方法;
);
            string fileName = "CSharpChap1.sln";
            //截取后綴名,文件名
            Console.WriteLine("后綴名:{0};文件名:{1}",
                fileName.Substring(fileName.IndexOf("."), fileName.Length - fileName.IndexOf(".")), fileName.Substring(0, fileName.IndexOf("."))
                );
            //記不住沒有關系,有個Path類提供了
            Console.WriteLine("Path類方式后綴名:{0};Path類方式文件名:{1}",
        Path.GetExtension(fileName),Path.GetFileNameWithoutExtension(fileName)      //如果你不知道Path來自那個命名空間,不要死機硬背,告訴你一個黃金級的快捷鍵 Shift+Alt+F10
    );
            
            #endregion

            #region 關於方法重載
            //輸入Reloading,然后輸入 (  會提示同名方法兩個不同的調用,這就是方法重載,關於重寫override是繼承里面的,子類重寫父類的方法,例如我們可以重寫Object對象的ToString()方法,所有的東西都是面向對象,C#中的類的祖先是Object,繼承Object,這里不多說了,以后會說的
            //Reloading(
            Console.WriteLine("\n\n\n============ 擴展方法調用=================\n");
            //擴展方法調用
            TestExtensionMethod th = new TestExtensionMethod(); //創建類的對象,創建好后,就可以調用可以訪問的屬性、變量和方法等
            GetExtensionMethodThree(th);
            //其他寫法     GetExtensionMethodThree(new TestExtensionMethod());    只希望領悟代碼是活的
            #endregion

            Console.WriteLine("\n\n\n============ 到此我認為的基礎C#知識已經學習完畢,本次demo耗時8個小時,謝謝學習=================\n");
            Console.ReadLine(); //為了讓控制台程序台暫時停止等待用戶輸入;或者Console.ReadKey
        }

        #region ref out params 關鍵字相關說明的方法
        /// <summary>     最常用的注釋,可以讓你在別處調用此方法時,有提示,該提示就是你自己命名的
        /// Ref修飾方法參數
        /// </summary>
        /// <param name="parameter">一個被ref修飾的int類型</param>
        public static void RefMethod(ref int parameter)      //static 只有加上static關鍵字,才可以在static的類(靜態類)中使用,static修飾的方法和字段,在運行時就被加載在內存中,不管你有沒有調用,盡量少用static,因為它占內存
        {
            parameter += 10; // 等同於parameter=parameter+10;
        }
        /// <summary>     最常用的注釋,可以讓你在別處調用此方法時,有提示,該提示就是你自己命名的
        /// Ref修飾方法參數
        /// </summary>
        /// <param name="parameter">一個被ref修飾的int類型</param>
        public static int OutMethod(out int parameter)   //parameter再傳過來時可以沒有值,也就是沒有初始化都沒關系
        {
            parameter = 20;
            parameter = parameter + 10;
            return parameter;
        }


        /// <summary>
        /// 非ref修飾方法參數,普通的方法
        /// </summary>
        /// <param name="parameter">一個int數字</param>
        public static void NotRefMethod(int parameter)
        {
            parameter += 10; // 等同於parameter=parameter+10;
        }

        public static void NotUseParams(Object[] obj)
        {
            //為了演示提取方法,特意這樣寫,選中你要重構的那些代碼,然后  快捷鍵 Ctrl+R,M
            FindObjectArray(obj);
            //順便演示先寫方法名,然后自動生成方法的快捷鍵 Ctrl+K,M
            MethodTestEasyFast();
        }

        private static void MethodTestEasyFast()
        {
            Console.WriteLine("演示先寫方法名,自動生成方法的快捷鍵 Ctrl+K,M演示成功!");
        }
        /// <summary>
        /// 遍歷數組中的元素,此方法的參數含有params關鍵字
        /// </summary>
        /// <param name="obj"></param>
        public static void UseParams(params Object[] obj)
        {
            FindObjectArray(obj);
        }
        /// <summary>
        /// 普通遍歷
        /// </summary>
        /// <param name="obj"></param>
        private static void FindObjectArray(Object[] obj)
        {
            foreach (Object item in obj)
            {
                Console.WriteLine(item);
            }
        }
        #endregion

        #region 方法重載
        //返回值 方法名相同,參數不同的方法
        public static void Reloading()
        {

        }
        public static void Reloading(string para1)
        {

        }
        //返回值不同 方法名相同,參數相同的,編譯都通不過哦,所以不要這樣寫OK?
        //public static int Reloading2(string para1)
        //{
        //    return 1;
        //}
        //public static void Reloading2(string para1)
        //{
        //}


        //以下是對TestExtensionMethod類的方法添加了一個新方法,叫ExtensionMethodThree,表面上這個類寫在program.cs下,你可以就把它當做在ExtensionMethodThree類里面寫就行了
        public static void GetExtensionMethodThree(TestExtensionMethod getMethodThree)
        {
            getMethodThree.ExtensionMethodOne();  //調用本類中的方法
            getMethodThree.ExtensionMethodThree();  //調用剛剛擴展的方法
        }
        #endregion

    }
    /*
     * 也是一種注釋
     * 回車一下試試
     * */
    public class PropertypPesentationsClass
    {
        //同一命名空間下的第二個類,可以寫在一個頁面里,也可以其他的cs文件里,本類主要演示屬性和命名法
        public PropertypPesentationsClass() { }
        public PropertypPesentationsClass(StringBuilder username)
        {
            this.UserName = username;   //理解好了this的用法,對代碼很有好處的,在js中也很常用
        }
        //快捷鍵:輸入prop+Tab*2
        public StringBuilder UserName { get; set; }  //Pascal命名法,常用於大名稱,例如類名方法名,屬性名,其他編程也有用到,太多了,不列舉了
        public StringBuilder userPwd { get; set; }  //Camel命名法,常用於變量名
        public StringBuilder User_Address { get; set; }  //匈牙利命名法1  個人喜好,想用就用吧,C++多一點
        public StringBuilder _UserAddress { get; set; }  //匈牙利命名法2
        public StringBuilder UAddress { get; set; }  //匈牙利命名法3


        //第二種寫法,先輸入        private StringBuilder userPhone; 然后封裝字段(快捷鍵Ctrl+R+E),變量名第一個小寫,你可以在封裝字段的界面里,取消預覽,確定后,按下delete鍵,使代碼更工整吧,如果你喜歡注釋,可以不delete
        private StringBuilder userPhone;
        /// <summary>
        /// 用戶電話              第四種注釋,在屬性或者方法上///,非常常用,而且這樣的注釋還可以到處xml文檔               快捷鍵  / *3
        /// </summary>
        public StringBuilder UserPhone
        {
            get { return userPhone; }
            set { userPhone = value; }
        }

        //如果你寫了大寫命名,后面就是加數字命名,以此類推,建議不要這樣
        private int UserAge;
        public int UserAge1
        {
            get { return UserAge; }
            set { UserAge = value; }
        }

        //屬性名用_開頭
        private int _UserEMail;
        public int UserEMail
        {
            get { return _UserEMail; }
            set { _UserEMail = value; }
        }

    }

    /// <summary>
    /// 本類知識用來學習擴展方法:當原來的類不能添加方法時,比如我們引入其他dll文件,源碼沒有,又想往它里面添加方法,就要用擴展方法了
    /// </summary>
    public class TestExtensionMethod
    {
        /// <summary>
        /// 順便演示4.0新特性 , 方法的參數可以直接在括弧里賦值,初始值
        /// </summary>
        public void ExtensionMethodOne(int hello = 3)
        {
            Console.WriteLine("擴展方法演示,我是方法一:我的參數默認值是{0}", hello.ToString());        //減少裝箱
        }
        public int ExtensionMethodTwo()
        {
            Console.WriteLine("擴展方法演示,我是方法二");
            return 1;
        }
    }
    public static class ExtensionTestExtensionMethod
    {
        //以下是對TestExtensionMethod類的方法添加了一個新方法,叫ExtensionMethodThree,表面上這個類寫在program.cs下,你可以就把它當做在ExtensionMethodThree類里面寫就行了
        //擴展方法必須在非泛型靜態類中定義
        public static void ExtensionMethodThree(this TestExtensionMethod methodThree)
        {
            Console.Write("我是擴展的方法,我被調用成功! \t");
            methodThree.ExtensionMethodOne();  //當做在TestExtensionMethod的類中寫,當然可以調用本類中的方法咯
        }

    }
}

demo1下載 

本期的C#篇主要學習基本語法,最近發現將代碼寫出,用代碼注釋講課,效果好很多倍。本代碼未經允許不允許粘貼復制作為個人勞動成果,僅供學習和交流,請尊重...

 

 

 

三、 C# AspNET篇 

3.1   優點:

  生成的代碼與瀏覽器無關 

方便設置斷點,易於調試

編譯后執行,運行效果提高

代碼后置,使代碼更清新

3.2    Asp.NET運行機制

      第一次會請求Asp.NET頁面時,Asp.NET引擎檢測這個頁面對應的類,找不到,Asp.NET引擎會=將會aspx文件和cs文件重新生成一個頁面類,並編譯成程序集,然后返回處理結果。

       第二次訪問時,無需再次編譯,只需要執行和輸出。

3.3    編碼方式:代碼內嵌(<%.....%),代碼后置

3.4    PostBack機制

      如果Page.IsPostBack為true時則為首次加載頁面

      if(!Page.IsPostBack){}//頁面不是首次加載時,控制

3.5    ViewState機制

      頁面代碼中<%@ Page EnableViewState="true" %>,或者控件的EnableViewState=”false”可以來禁用

3.6   Asp.NET 生命周期

主要階段:頁面初始化時(Init){實例化所有控件,並賦予默認值}→加載頁面時(Load){IsPostBack是否首次加載,不是的話,則為控件加載ViewState,讀取並更新控件的屬性值}  →

服務器端控件進行驗證時→控件事件時→頁面顯示時(Render){不是事件,對該頁和所有控件的保存視圖狀態,調用每個控件的Render()方法,Response對象已經不可用}→頁面卸載時(Unload){將該頁面發送至客戶端,釋放資源,寫在頁屬性,例如Request和Response}

3.7   Request對象

      URL地址:例如跳轉(重定向)   Response.Redirect("Default2.aspx?txtUser="+this.TextBox1.Text+"&action=delete"); 

Default2.aspx頁面

       獲取值: Request.QueryString[“…”],Request.Form[“…”],Request[“…”],Request.Params[“…”]

       瀏覽器,服務端,客戶端信息 

Request.ServerVariable[“…”],例如HTTP_USER_AGENT;    Request.Browser…

      Request.URL 獲取當前請求的URL信息

      方法:Request.MapPath(),將請求的URL中的虛擬路徑映射到服務器的物理路徑

3.8  Response對象

     Response.Write(),Response.Redirect() 

3.9  Cookie對象 

            Response.Cookies["userLogin"].Value = "楊洋";

            //或者

            HttpCookie cookie = new HttpCookie("userLogin2", "芳芳");

            Response.Cookies.Add(cookie);

     保存時,同名覆蓋;Expires設置為MaxValue,永遠不過期,未設置,則關閉瀏覽器結束保存;Cookie可禁用,4KB大小

     應用:用戶瀏覽記錄,用戶上次登錄時間

 

四、 C# SQLSERVER篇  

    這里以company這個數據庫為例

 

      4.1  附加數據庫

 

exec sp_attach_db @dbname='company',@filename1='C:\Users\yangyang\Desktop\網頁教程demo\DB\company_Data.MDF'

 

,@filename2='C:\Users\yangyang\Desktop\網頁教程demo\DB\company_Log.LDF'

 

      4.2  備份數據庫

 

           backup database company to disk='D:\backupSQLSRVER\20120611company.bak'

 

      4.3  還原數據庫

 

            use master

 

            go

 

            restore database company from disk='D:\backupSQLSRVER\20120611company.bak'

 

      4.4   收縮數據庫

 

            DBCC SHRINKDATABASE(company)

 

       4.5  分離數據庫

 

            exec sp_detach_db 'company'

 

五、 C# JavaScript篇 

         5.1  初次認識

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>
</head>
<script>
function Add(a){
    alert('你調用了:'+a);
    }
Add(15);


//var f1=function(a){alert(a)};
//alert(f1(15));


<!--alert(function(a,b){return a+b;}(1,2));-->

</script>
<body>
<a href="javascript:alert('超鏈接調用js1')">超鏈接調用js1</a>
<a href="1.html" onclick="alert('超鏈接調用js2')">超鏈接調用js2,單擊后跳轉1.html頁面</a>
<input type="button" onclick="Add('js調用方式3')" value="js調用方式3"/>
</body>
</html>

 

 

 

 

         5.2  數組與集合的js用法

         

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>
</head>
<script type="text/javascript">
/*當Dictionary用*/
/*var dicTest=new Array();
dicTest["sql基礎"]=38.9;
dicTest["sql中級"]=59;
dicTest["sql高級"]=89;
alert(dicTest["sql中級"]);
alert(dicTest.sql高級);*/

/*當Array用   數組是dictionary的一個特例*/ 
/*var arrayTest=new Array();
arrayTest[0]='sql基礎';
alert(arrayTest[0]);*/

/*for循環*/
/*var dicTest=new Array();
dicTest["sql基礎"]=38.9;
dicTest["sql中級"]=59;
dicTest["sql高級"]=89;
for(var i in dicTest){   //遍歷出這個集合所有的鍵,類似c#的foreach,還有1個for循環
    alert(i+'   價格:'+dicTest[i]);
    }*/
    
/*array簡化聲明*/
/*①數組   用[] 括號表示*/
/*var array=['sql基礎','sql中級','sql高級'];    
for(var i=0;i<array.length;i++){
    alert(array[i]);
    }
alert(array.join('@'));*/
    
/*②字典  用{}  表示*/
/*var dicTest={"sql基礎":38.9,"sql中級":59,"sql高級":89};
for(var key in dicTest){
    alert(key+":"+dicTest[key]+"元");
    }*/
    
</script>

<body>
</body>
</html>

 

5.3 JavaScript也有OOP,別誤解了,沒有類的說法

這里的Book你可以曲解跟C#中的類相比,GetBookIntroduction是一個方法,屬性一不要事先聲明,最好玩的是調用Book的時候會有代碼提示

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>
</head>
<script type="text/javascript">
  function Book(title,price,author){
      
      this.Title=title;
      this.Price=price;
      this.Author=author;
      this.GetBookIntroduction=function(){
          alert('書名:'+this.Title+'它的價格是:'+this.Price+",作者:"+this.Author);
          };
      }      
      var SqlBook=new Book('sql編程基礎',39.8,'楊洋');
      SqlBook.GetBookIntroduction();
      SqlBook.Author='亞馬遜';
      SqlBook.GetBookIntroduction();
</script>

<body>
</body>
</html>

待添加...

 

六、 C# JQuery篇 

      既然會了JQuery,我覺得不要花太多的時間放在DOM編程上了,但是我也會補充一點,JQuery就是,你要用一切方法獲得你想要的元素,然后用js或者jquery提供的某些東西,去改變你想要的元素

   6.1  初次見面,在HTML中,先導入jquery的js文件,一個最簡單的調用,<script type="text/javascript" src="js/jquery-1.7.2.min.js">,即引入了,還有個js/jquery-ui-1.8.20.custom.min.js先不要管,它是一個jquery的ui庫  

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>基礎</title>
</head>
<script type="text/javascript" src="js/jquery-1.7.2.min.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">
/*①是②的簡寫形式*/
/*$(function(){alert('第一種方式!')});*/


/*②創建加載*/
/*$(document).ready(function() {
    alert("第二種方式");
});
*/

/*原始的DOM方式,很像C#中的委托形式,onload只能注冊一次,而且只執行最后一次注冊的,不信的話你可以試一試*/
window.onload=function(){
    alert('第一種方式');
    };
window.onload=function(){
    alert('第二種方式');
    };
    
/*onload是在所有DOM元素創建完畢圖片CSS都加載完了才被觸發,而JQuery中的ready是在Dom元素創建完未加載時就觸發了,提高了網頁的響應速度*/
</script>

<body>

</body>
</html>

 

6.2 初次體驗

   

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>初次體驗</title>
</head>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">
$(
function(){
    $("#btn1").click(function(){
        alert(this.value); /*this代表事件源,你可以認為是引發事件的那個對象,這里就是id為btn1的按鈕對象*/
        });
    
    $("#btn2").click(
    function(){$("#div1").toggle("slow");} /*把toggle改成hide試試*/
    );
}
);
</script>
<body>
<input type="button" id="btn1" value="獲得提示"/>
<input type="button" id="btn2" value="隱藏下面文字"/>
<div id="div1">
陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋陽陽陽陽陽陽陽陽楊洋
</div>
</body>
</html>

 

 

6.3 jquery的數組和集合的遍歷 .map()   .each()

    

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>遍歷數組</title>
</head>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>

<script type="text/javascript">
/*①$.map(array,函數)     不能處理Dictionary風格的數組*/
/*var array=[1,2,3,4,5,6];
$.map(array,function(item){
    alert(item*2);
    });
*/


/*②$.each(array,函數)*/
<!--案例1-->
/*var dicTest={"sql基礎":38.9,"sql中級":59,"sql高級":89};
$.each(dicTest,function(key,value){
    alert("key:"+key+"  value:"+value);
    });*/
    
<!--案例2-->
/*var array1=[1,2,3,4,5,6];
$.each(array1,function(key,value){
        alert("key:"+key+"  value:"+value);   //key竟然是array1的元素的索引,從0開始
    }
);*/

<!--案例3-->
/*var array3=[3,4,5,6];
$.each(array3,function(){alert(this);});   //就是里面的值
*/


<!--案例4-->
var dicTest4={"sql基礎":38.9,"sql中級":59,"sql高級":89};
$.each(dicTest4,function(){
    alert(this);            //this在這里竟然是value,不是key
    });

</script>

<body>
</body>
</html>

 

6.4 Jquery對象和DOM對象 css(),html(),val(),text()

 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Jquery對象和DOM對象</title>
</head>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">
/*①這里的$("#test1")指的就是Jquery對象,既然是對象,就能夠調用對象的屬性或者方法,這里調用了html()方法*/
/*$(
function(){
    alert($("#test1").html());
    
    }
);
*/

/*②傳統的DOM對象操作,類比①中的方法*/
/*window.onload=function(){
var a=document.getElementById("test1").innerHTML;
alert(a);
}*/



/*③案例集合*

<!--案例1-->
/*$(function(){
    $("#test1").html('<a href="http://www.cnblogs.com/">去博客園</a>');      //①外面竟然是雙引號,為了能解析,里面的原本是雙引號的當然要寫成單引號啦!②外面用單引號,里面用該什么樣子就什么樣子,極力推薦第二種
    });*/
    
    
<!--案例2-->
//將JQuery對象轉換成DOM對象,$(DOM對象)[0]
/*$(function(){
var domTest=$("#test1")[0];
alert(domTest.innerHTML);
});*/


<!--案例3  JQuery的對象CSS()-->
/*$(function(){
    $("#myList li").css("background","red");   //學過CSS的都能潛移默化的很容易接受  $(選擇器)   選擇器的寫法,這個很像CSS中選擇器,這里表示id為myList的對象里面的 所有li元素,獲得對象后,就可以調用Jquery對象的屬性或者方法操作了,學會基本的語法或者常用的Jquery對象方法后,你就可以學着去用Jquery手冊自己學習提高了
    
    alert($("#myList li").css("background"));
    });*/

<!--案例4  JQuery的對象val()-->
/*$(function(){
    $("#txtName").val("茗洋芳竹");   //應該懂了吧,我覺得學了JQuery,你可以基本忘掉以前的那些DOM了
    alert($("#txtName").val());
    });
*/

<!--案例5 text()方法相當於 DOM的innerTEXT-->
$(function(){
    alert($("#test1").text());  //不含html標簽代碼,你可以把它放心的和html方法類比
    });
    
</script>

<body>
<div id="test1">測試1
<ul style="float:left;list-style:none" id="myList">
<li id="title">
楊洋瘋狂C#
</li>
<li id="author">
編寫人:楊洋
</li>

</ul>
<input type="text" id="txtName" value="待定"/>
</div>
</body>
</html>

 

6.5  Jquery選擇器(基本) 標簽,ID,類選擇器

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Jquery選擇器</title>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
    
<style type="text/css">
/*只為演示方便,所以在這里寫樣式,建議將樣式與界面分離,還有js代碼*/

.current {                          /*類選擇器,頁面中在元素里用class="current" 就可以應用這里定義的樣式了*/
    border-bottom: thin #03F 2px;
}
ul li {                           /*css中的標簽選擇器   空格代表包含關系,后面的元素在前面的元素中,這里可以理解為本頁面中所有ul下的所有li元素都應用這個樣式*/
    list-style: none;              /*去除li前面的的列表標記*/
    float:left;               /*元素左浮動,當然還有右浮動,具體的就可以看他的提示代碼,然后改一下看一下效果,試試就知道了*/
    cursor:pointer;
}
ul li:hover{                      /*:hover 錨偽類,還有其他的很多,這個效果是鼠標移上去的css效果,當然也能用js寫的*/
    
    }
</style>
<script type="text/javascript">
//在學之前,如果你會CSS,那么學起來將特別的簡單

<!--案例1 $(標簽)-->
$(
function(){
    //tagname選擇器
    $("p").text("哈哈");  //所有P元素都會被賦值 , 相當於DOM的 getElementByTagName("p")
    
    //id選擇器
    $("#div1").text("div也被賦值了");  //用# 加上 id名,即可獲得此id的元素對象,相當於 getElementById("div1")
    
    //類選擇器
    $(".current").click(function(){
        window.location.href="http://www.baidu.com";
        });
    }
);

</script>
</head>
<body>
<p>第一個哈哈</p>
<p></p>
<p></p>
<p></p>
<p></p>
<div id="div1">
</div>
<div id="div3">
  <ul>
    <li class="current">&nbsp;百度首頁</li>
    <li>&nbsp;購物廣場</li>
    <li>&nbsp;會員中心</li>
    <li>&nbsp;幫助</li>
  </ul>
</div>
</body>
</html>

 

6.6  Jquery初接觸事件 mouseenter 你可以拓展到其他事件試試

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>
</head>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">
$(function(){
var elements=$("#test1");//驗證一下是否有id叫test1的DOM元素
if(elements.length<=0){
    alert('沒有');
    return;
    }    
    
    
$("#test1").mouseenter(
function(){
alert('真移動上去了');
});    

});
</script>
<body>
<input id="test1" type="button" value="移到我頭上看看" />
</body>
</html>

 

6.7  Jquery元素獲取技巧1  next()  nextAll() siblings()

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>元素獲取技巧1</title>
</head>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">

$(function(){
    //next()方法用於獲得節點之后的挨着的第一個同輩的元素,nextAll(),單方向的
    //案例1
      /*$("div").click(function(){
        alert($(this).next("div").text());
        });*/
        
    //案例2
/*    $("div").click(function(){
        alert($(this).next("p").text());
        })    */
        
    //案例3
/*    $("div").click(function(){
        alert($(this).nextAll("div").text());
        })    */
        
    //案例4
/*    $("div").click(function(){
    $.each($(this).nextAll("div"),function(){
        $(this).css("background","red");
        });
})*/
    
    //案例5  無須循環
/*    $("div").click(function(){
    $(this).nextAll("div").css("background","red");
    })
    */
    
    
    //sblings()用於獲取所有同輩元素
    //案例6  silings 選中當前元素背景有色,其他兄弟同級別無色
     $("div").mouseover(function(){
        //第一種寫法,非鏈式寫法
/*     $(this).css("background","red");
     $(this).siblings("div").css("background","white").css("cursor","pointer");*/
    
     //第二種寫法,鏈式的寫法,Jquery的風范
     $(this).css("background","red").siblings("div").css("background","white");
});

});

</script>
<body>
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<p>5</p>
<div>6</div>
<div>7</div>
<div>8</div>
</body>
</html>

 

6.8  Jquery 評分控件  removeClass() 刪除一個css樣式,addClass()   添加一個css樣式,如果有css基礎就好學了

  $("#rating td")中間有個空格,跟css中一樣,表示td是id為rating元素的子元素,說白了,id為rating的元素下的所有td元素

如果改成了  $("#rating .borderstyle")   則代表  id為rating的元素下的所有應用了borderstyle這個樣式的元素

如果改成了  $("#rating td.borderStyle")  則代表  id為rating的元素下的所有應用了borderstyle這個樣式的td類型的元素

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>評分</title>
</head>
<style type="text/css">
.borderStyle{
    border:#F00 2px solid;
    }
</style>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">
$(
function(){    
//先全部初始狀,鼠標移上去,先全部變成激活狀,然后設置事件源的右邊同輩元素設初始狀
$("#rating td").html('<img src="images/1.png" width="12" height="12" />').mouseover(function(){
    $("#rating td").html('<img src="images/2.png" width="12" height="12" />');
    $(this).nextAll().html('<img src="images/1.png" width="12" height="12" />');
    });
  
 //添加樣式addClass(),RemoveClass() 
$("#rating td").addClass("borderStyle");
$("#rating td").click(function(){
$(this).removeClass("borderStyle");
});
}
);
</script>
<body>
<table id="rating">
  <tr>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
</table>
</body>
</html>

 

6.9 JQuery 過濾器  本例子有很多知識點

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>過濾器</title>
</head>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<style type="text/css">
.boldTitle {
    font-weight: bold;
    font-size: 14px;
    text-align: center;
}
.last {
    text-align: center;
    font-size: 18px;
}
</style>
<script type="text/javascript">
$(
function(){
//表格第一行標題加粗
$("#table1 tr:first").addClass("boldTitle");
//表格最后一行標題加粗
$("#table1 tr:last").addClass("last");

//前三行字體變大,tr的序號是大於0小於4的,因為:gt先大於0那么從編號為1的又重新開始編索引,那么編號再小於3的只有  123了
$("#table1 tr:gt(0):lt(3)").css("font-size","28px");//也可以寫成28

//排除第一行標題后取奇數行,背景設為紅色
$("#table1 tr:gt(0):even").css("background","red");

//相對選擇器
$("#div2").click(
function(){
$("ul",$(this)).css("background","red");   //第二個參數表示前一個元素的基准點,相對定位
}
);



//屬性過濾器表單對象過濾器
$("input[value=顯示選中項]").click(function(){
alert($("input:checked").val());
});


//遍歷的each的另一種用法,數組.each()
$("input[name=ckBooks]").click(
function(){
var names=$("input[name=ckBooks]:checked");
var arr=new Array();
names.each(function(index, element) {       //開始遍歷
    arr[index]=$(element).val();
});
$("#women").text("你選中了"+arr.length+"條:"+arr.join(","));
}
);

//表單選擇器
/*$(":input");      //例如還有:text    :password  :hidden  :radio   :checkbox     :submit  :image    :reset    :file    :button等*/

//attr方法
alert($("#link1").attr("href"));  //獲得
//設置
$("#link1").attr("href","http://www.google.com")
}
);
</script>
<body>
<table id="table1" width="200" border="1">
  <tr>
    <td>編號</td>
    <td>姓名</td>
  </tr>
  <tr>
    <td>1</td>
    <td>網吧</td>
  </tr>
  <tr>
    <td>2</td>
    <td>王武</td>
  </tr>
  <tr>
    <td>3</td>
    <td>天霸</td>
  </tr>
  <tr>
    <td>4</td>
    <td>虎妞</td>
  </tr>
  <tr>
    <td>5</td>
    <td>七八</td>
  </tr>
  <tr>
    <td>上一頁</td>
    <td>下一頁</td>
  </tr>
</table>
<div id="div2">
  <ul id="ul1">
    <li>a</li>
    <li>b</li>
    <li>c</li>
    <li>d</li>
    <li>e</li>
  </ul>
</div>
<div id="div3">
  <ul id="ul2">
    <li>a2</li>
    <li>b2</li>
    <li>c2</li>
    <li>d2</li>
    <li>e2</li>
  </ul>
</div>
<div id="checkBoxes">
  <input type="checkbox" name="ckBooks" value="sql"/>
  sql書
  <input type="checkbox" name="ckBooks" value="html"/>
  html書
  <input type="checkbox" name="ckBooks" value="C#"/>
  C#書</div>
<input type="button" value="顯示選中項"/>
<a href='http://www.baidu.com' id="link1">百度</a>
<div id="women"></div>
</body>
</html>

 

6.10 動態創建DOM節點 append(),appendto,自己拓展學習after,before

 

 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>動態創建DOM節點</title>
</head>
<style type="text/css">
.current{
 background:#069;
    }
</style>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">
$(
function(){
//append常用的一個方法,在元素的末尾追加一個元素,添加一個節點,相對應的還有個AppendTo
/*var ele=$('<a href="http://www.baidu.com">百度</a>');
$("div:first").append(ele);*/


//prepend在元素的開始添加元素,after在元素之后添加元素(添加兄弟),before,




//加載書籍列表
var books={"sql基礎":"28.98","sql中級":"49.98","sql高級":"99.98"};
$.each(books,function(a,b){
var tr=$('<tr><td>書名:'+a+'</td><td>書架:¥'+b+'</td></tr>');
$("#booklist").append(tr);
});




//刪除一個節點Remove(),相當於剪切
/*$("#ul1 li.current").remove();*/


//其實沒有刪除,剪切
var ff=$("#ul1 li.current").remove();
$("#ul2").append(ff);
}
);
</script>
<body>
<div>
<table id="booklist">

</table>
<ul id="ul1">
<li class="current">aaaaa</li>
<li>bbbbb</li>
<li>ccccc</li>
<li>ddddd</li>
</ul>
<ul id="ul2"></ul>
</div>
</body>
</html>

 

 

6.11 簡單的權限管理,append操作,remove()

   remove()我覺得理解剪切更好,$("#select1 option:selected")表示id為select1元素下的  option節點,:selected是個過濾器,表示選中的

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>權限管理模擬</title>
</head>
<style type="text/css">
#buttons{
    float:left;
    width:100px;
    }
#buttons input{
    float:left;
    width:100%;
    }
</style>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">
$(
function(){
$("#ltr").click(function(){
var ite=$("#select1 option:selected").remove();
$("#select2").append(ite);
});
}
);
</script>
<body>
<select style="height:100px;float:left" name="leftAuthorization" multiple="multiple" id="select1">
<option>添加</option>
<option>刪除</option>
<option>修改</option>
<option>查詢</option>
<option>打印</option>
</select>
<div id="buttons">
<input type="button" id="ltr" value=">"/>
<input type="button" value=">>"/>
<input type="button" value="<"/>
<input type="button" value="<<"/>
</div>
<select style="height:100px;width:100px;float:left" name="rightAuthorization" multiple="multiple" id="select2"></select>
</body>
</html>

 

6.12  加法計算 

 

$("input[name=txtOne]")表示input標簽里 name屬性為txtOne的元素,想一想還可以怎么拓展

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>加法計算</title>
</head>

<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">
$(
function(){
    $("#calc").click(function(){
        var c=parseInt($("input[name=txtOne]").val())+parseInt($("input[name=txtTwo]").val());
        $("input[name=txtResult]").val(c);
});
});
</script>
<body>
<input name="txtOne" type="text" />+<input name="txtTwo" type="text" /><input value="計算" id="calc" type="button" /><input name="txtResult" type="text" />
</body>
</html>

 

 

6.13  倒計時

setInterval(方法名稱(),時間),多少秒執行一次這個指定的方法,clearInterval,清除計時器
attr(),屬性,可讀取屬性值,設置屬性值

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>倒計時</title>
</head>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">

var times=10;
var timeInte;
$(
function(){
    $("#nextg").val("請仔細閱讀,還剩"+times+"");
$("#nextg").attr("disabled","true");//禁用按鈕
timeInte=setInterval("fre()",1000);
}
);


function fre(){
if(times<=0){
$("#nextg").val("同意");
$("#nextg").attr("disabled","false");//啟用按鈕
clearInterval(timeInte);
return;
    }else{
$("#nextg").val("請仔細閱讀,還剩"+times+"");
times--;
        }
}

</script>
<body>
<textarea name="" cols="" rows="">ffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</textarea>
<input name="ff"id="nextg" type="button" value="同意" />
</body>
</html>

 

6.14 Jquery 焦點事件接觸,水印文本框

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>blur focus</title>
</head>
<style type="text/css">
.borderRed {
    border: #F00 1px solid;
}
</style>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">

$(
function(){
$("#one1").focus(function(){
$("#one1").addClass("borderRed");
if($("#one1").val()=="請輸入內容"){
    $("#one1").val("");
    }
}
);
$("#one1").blur(function(){
$("#one1").removeClass("borderRed");
if($("#one1").val()==""){
    $("#one1").val("請輸入內容");
    }
}

);

}
);
</script>
<body>
<!--第一種方式,通常也用於文本框失去焦點驗證輸入是否合法-->
獲得焦點事件,離開事件
<input type="text" id="one1" value="請輸入內容"/>
<!--第二種方式-->

水印文字
<input type="text" name="textfield" value="我愛你" onfocus="if(this.value=='我愛你')this.value='';" onblur="if(this.value=='')this.value='我愛你';" />
</body>
</html>

 

6.15  Jquery樣式管理,addClass,removeClass,hasClass,toggleClass,filter:Gray,搜索框效果

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>樣式管理</title>
</head>
<style type="text/css">
.fontColor {
    color: #F00;
}
.grayBrush {
    color:#666;
}
body{
/*    filter:Gray;*/      /*窗體變成黑白色*/
    }
</style>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">
$(
function(){
    
$("#addclass").click(function(){
$("#title").addClass("fontColor");
});
$("#removeclass").click(function(){
$("#title").removeClass("fontColor");
});
$("#toggleclass").click(function(){
$("#title").toggleClass("fontColor");   //toggle 是切換的意思,以后還會遇到很多次
});
$("#hasclass").click(function(){
alert($("#title").hasClass("fontColor"));  //是否應用了這個樣式
});

//模仿前面的鼠標移上去移走的效果(高亮顯示)addClass,removeClass
$("#gr input").mousemove(function(){
$(this).addClass("fontColor").siblings().removeClass("fontColor");
});

//搜索框
$("#txtSearch").val("請輸入搜索關鍵字").addClass("grayBrush")
.focus(function(){
if($(this).val()=="請輸入搜索關鍵字"){
    $(this).val("").removeClass("grayBrush");
}})
.blur(function(){
if($(this).val()==""){
    $(this).val("請輸入搜索關鍵字").addClass("grayBrush");
    }

});

});

//關於調試瀏覽器的兼容性
// IECollection   IETester工具都可以
</script>
<body>
<b id="title">我們依然繼續</b>
<div id="gr">
  <input type="button" id="addclass" value="addClass()" />
  <input type="button" id="removeclass" value="removeClass()" />
  <input type="button" id="toggleclass" value="toggleClass()" />
  <input type="button" id="hasclass" value="hasClass()" />
</div>

<input type="text" value="" name="searchBox" id="txtSearch"/>
</body>
</html>

 

6.16 節點操作  replaceWith,wrap方法,當然也有unwrap方法,自己參考手冊學習

 

 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>節點操作</title>
</head>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">
$(
function(){
//將換行替換成分割線
$("br").replaceWith("<hr/>");

/*wrap()用來包裹元素*/
$("p").wrap('<font size="12px" color="red"></font>');
}
);
</script>
<body>
<br/>
<p>我一直都在等待1</p>
<p>我一直都在等待2</p>
<p>我一直都在等待3</p>
</body>
</html>

 

6.17 radiobutton  Jquery操作

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>radiobutton操作</title>
</head>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">
$(
function(){

}
);
function getRdoValue(){
    if($("input:radio:checked").length>0){
    alert($("input:radio:checked").val());
    }
    }
    
function setBoy(){
    $("input[name=gender]").val([""]);
    
    }
function setGirl(){
    $("input[name=gender]").val([""]);
    
    }
</script>
<body>
<input name="gender" type="radio" value="" /><input name="gender" type="radio" value="" /><input type="button" value="獲取radiobutton的值" onclick="getRdoValue()"/>
<input type="button" value="設置為男" onclick="setBoy()"/>
<input type="button" value="設置為男" onclick="setGirl()"/>
</body>
</html>

 

 

6.18 checkbox 操作 全選,反選,全不選問題

 反選可能你難理解一點,設置checked值為原值的反值,true的反值就是false

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>全選全不選反選</title>
</head>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">
function SetAll(){
$("input[name=books]").attr("checked",true);    
    }
function SetFan(){
$("input[name=books]").each(function(
) {
    $(this).attr("checked",!$(this).attr("checked"));
});
    }
function SetNo(){
$("#ckList :checkbox").attr("checked",false);    
    }
</script>
<body>
<div id="ckList">
<input type="checkbox" name="books" value="sql基礎練習"/>sql基礎練習</br>
<input type="checkbox" name="books" value="sql入門進階"/>sql入門進階</br>
<input type="checkbox" name="books" value="sql中級"/>sql中級</br>
<input type="checkbox" name="books" value="sql風采"/>sql風采</br>
<input type="checkbox" name="books" value="sql我猜"/>sql我猜</br>
</div>
<div>
<input type="button" value="全選" onclick="SetAll()"/>
<input type="button" value="反選" onclick="SetFan()"/>
<input type="button" value="全不選" onclick="SetNo()"/>
</div>
</body>
</html>

 

 

 

6.19 事件初步了解   .hover事件,hover(移入事件,移出事件),bind,bind第一個參數,不一定要js自帶的事件,例如不需要click,你也可以寫pressed

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>事件</title>
</head>
<style type="text/css">
.overlight{
    background:url(../image/Button.png) no-repeat 100% 100%;
    color:white;
    width:90px;
    height:35px;
    border:0px;
    margin:0px;
    padding:0px;
    font-weight:bold;
    }
.leavelight{
    background:url(../image/Button.png) no-repeat  0% 0%;
    width:90px;
    height:35px;
    color:red;
        border:0px;
    margin:0px;
    padding:0px;
        border,margin,padding:0px;
    font-weight:bold;
    }
</style>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">
$(
function(){
//以前是   元素.bind("click",function(){});   簡寫 元素.click(function(){});
$("#test1").bind("click",function(){
alert("bind 測試成功!");    /*你可以將click替換成其他事件*/
});

$("#test2").click(function(){
alert("bind 的簡寫形式測試成功!");    /*你可以將click替換成其他事件*/
});

$("#test3").hover(
function(){
$("#test3").attr("class","overlight");
},
function(){
$("#test3").attr("class","leavelight");
}
);

$("#test4").hover(
function(){
$(this).text("你來了");
},
function(){
$(this).text("你慢走");
}
);
});
</script>
<body>
<input name="test1" type="button" id="test1" value="測試bind方法"/>
<input name="test2" type="button" id="test2" value="測試bind方法簡寫形式"/>
<input name="test3" id="test3" type="button" style="cursor:pointer" class="leavelight" value="hover">
<p id="test4">你慢走!</p>
</body>
</html>

 

6.20  事件冒泡   stopPropagation()阻止

 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>事件冒泡</title>
</head>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">
$(
function(){

//本例在其他語言有共通之處,其他語言也有事件冒泡一說,例如wpf中的冒泡事件和隧道事件
$("#p1").click(function(e){alert("p1被點擊了");e.stopPropagation()});
$("#a1").click(function(){alert("a1被點擊了")});
$("#b1").click(function(){alert("b1被點擊了")});
$("#tb1").click(function(){alert("tb1被點擊了")});
$("#tr1").click(function(){alert("tr1被點擊了")});
$("a").click(function(e){
alert("超鏈接失敗!");
e.preventDefault();
});

//冒泡事件小范圍會波及的它的父節點的同性質事件,同時的它的父節點也觸發它的父父節點的同性質的事件,以此類推,范圍有小變大,就像冒泡一樣
//組織冒泡用  stopPropagation()    
});
</script>
<body>
<table>
  <tr id="tr1">
    <td id="a1">aaaaa</td>
    <td><table id="tb1">
        <tr >
          <td id="b1"><p id="p1">bbbbb</p></td>
          <td>cccccccc</td>
        </tr>
      </table></td>
  </tr>
</table>

<a href="http://www.baidu.com"/>阻止默認行為</a>
</body>
</html>

 

 

6.21 鼠標鍵盤事件略講  e.target  通過此屬性可獲得事件源對象,e.pageX,e.pageY獲得鼠標的位置,

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>鼠標鍵盤事件</title>
</head>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">
$(
function(){
//獲得觸發事件的元素
$("#div1").click(function(e){
var a=e.target;
alert(a.innerHTML);
});


//keyCode(鍵盤碼)    charCode(ASC碼)
$(document).mousemove(    //跟着鼠標走
function(e){
$("#div2").css("left",e.pageX).css("top",e.pageY);
}
);

});
</script>
<body>
<div  id="div1" style="width:140px">pppppppppppp</div>
<div id="div2" style="position:absolute"><img src="images/1.png" alt="確定"/></div>
</body>
</html>

 

 

6.22 e.pageX,e.PageY練習

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>
</head>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">
//集合重新認識,假設是AJAX傳過來的JSON數據
var dic={"images/a.png":["images/aa.png","楊洋瘋狂C#平面圖","25.98"],"images/b.png":["images/bb.png","楊洋瘋狂C#立體","49.98"]};


$(
function(){


//attr新認識,你可以添加不存在的屬性名,只為存一個臨時數據,以便讀取
$.each(dic,function(key,value){
//注意這里的value也是一個數組
var smallImg=$('<img src="'+key+'"/>');
smallImg.attr("imgSrc",value[0]);
smallImg.attr("imgName",value[1]);
smallImg.attr("imgPrice",value[2]);


//添加事件
smallImg.mouseover(function(e){
$("#detailImage").attr("src",$(this).attr("imgSrc"));
$("#title").text($(this).attr("imgName"));
$("#price").text($(this).attr("imgPrice"));
$("#details").css("left",e.pageX).css("top",e.pageY).css("display","block");
});



//添加此圖片元素
$("body").append(smallImg);

});

});
</script>
<body>
<div style="position:absolute;display:none" id="details">
<img src="" id="detailImage"/>
<p id="title"></p>
<p id="price"></p>
</div>

</body>
</html>

 

 

6.23 基本動畫 hide,show,更多的請參考手冊學習

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>小型動畫show,hide,toggle</title>
</head>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">
$(
function(){
$("#hideButtonId").click(function(){
$("#baseHide").hide();  /*隱藏*/

});

$("#ahideButtonId").click(function(){
$("#baseHide").hide("slow");  /*動畫隱藏    試着換成fast*/

});

$("#showButtonId").click(function(){
$("#baseHide").show();  /*顯示*/

});

$("#ashowButtonId").click(function(){
$("#baseHide").show("slow");  /*動畫顯示*/

});

$("#toggleButtonId").click(function(){
$("#baseHide").toggle();    //隱藏,出現,來回切換
});


$("#atoggleButtonId").click(function(){
$("#baseHide").toggle("slow");    //隱藏,出現,來回切換
});




});
</script>
<body>
<div id="baseHide">
楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#楊洋瘋狂C#
</div>
<input name="hideButton" id="hideButtonId" type="button" value="隱藏hide" />
<input name="ahideButton" id="ahideButtonId" type="button" value="動畫隱藏hide" />
<input name="showButton" id="showButtonId" type="button" value="顯示show" />
<input name="ashowButton" id="ashowButtonId" type="button" value="動畫顯示show" />
<input name="toggleButton" id="toggleButtonId" type="button" value="切換toggle" />
<input name="atoggleButton" id="atoggleButtonId" type="button" value="動畫切換toggle" />
</body>
</html>

 

 

6.24  qq盒子效果,事件的人工觸發

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>qq盒子according效果</title>
</head>
<style type="text/css">
#menu li{
        list-style:none;
        cursor:pointer;
    }
#menu{
    border:3px solid #900;
    background:url(images/styl%2011.jpg);
    width:100px;
    
    }
/*去點點*/
.childPanel{

    font-family:微軟雅黑;
    text-align:left;
    width:100%;
    }
#menu li a{
text-decoration:none;
cursor:pointer;
font-size:12px;
color:white;

    }
.header{
    background:#999;
    }


</style>

<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">
$(
function(){
//先創建一個如下的ul,li樣式
//偶數行添加樣式
$("#menu li:odd").addClass("childPanel");
//奇數行添加單擊事件
$("#menu li:even").addClass("header").click(function(){
$(this).next("li.childPanel").show("fast").siblings("li.childPanel").hide("fast");
});


//到目前基本已經完成了
//觸發單擊事件
$("#menu li:first").click();
});
</script>


<body>
<ul id="menu">
<li>我的好友</li>
<li><a href="htp://www.baidu.com">阿花</a>
<br />
<a href="htp://www.baidu.com">阿牛</a>
<br />
<a href="htp://www.baidu.com">阿毛</a>
</li>

<li>大學同學</li>
<li><a href="htp://www.baidu.com">天子</a>
<br />
<a href="htp://www.baidu.com">禿子</a>
<br />
<a href="htp://www.baidu.com">房子</a>
</li>


<li>綠林老友</li>
<li><a href="htp://www.baidu.com">鬼見愁</a>
<br />
<a href="htp://www.baidu.com">兔仔雞</a>
<br />
<a href="htp://www.baidu.com">老郢</a></li>


<li>陌生人</li>
<li><a href="htp://www.baidu.com">孩子</a>
<br />
<a href="htp://www.baidu.com">瘋子</a>
<br />
<a href="htp://www.baidu.com">傻子</a></li>
</li>
</ul>

</body>
</html>

 

 

 

 6.25 Jquery Cookie

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>插件1--Cookie</title>
</head>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery.cookie.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">
$(
function(){
    //加載上次登錄保存的用戶名
    if($.cookie("userName")){
        $("#txtUserNameID").val($.cookie("userName")); //我的不支持谷歌,ie,firefox測試通過
        }
    
$("#loginButtonID").click(function(){
if($("#loginButtonID").val().length>0){
    $.cookie("userName",$("#txtUserNameID").val()); //存進值,$.cookie(鍵,值)
    alert("登錄成功!");
    /*$.cookie(A,B,C)        C這個第三個參數   {expires:7,path:'/,domain:baidu.com,secure:true'}    可以先不管,具體遇到再補習*/
}


});
});
</script>
<body>
<input name="txtUserName" id="txtUserNameID" type="text" />
<input name="btnLogin" type="button" id="loginButtonID" value="登錄" />
</body>
</html>

 

 

6.26 Jquery UI介紹與初體驗,tab和dialog

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JqueryUI初接觸</title>
</head>
<!--把下載好的ui包解壓后,development-bundle\themes\ui-darkness這個文件夾拷貝到項目下,引入ui-darkness/jquery-ui-1.8.20.custom.css這個樣式,或者自己看着ui包解壓后就有個案例,模仿着用吧-->
<link rel="stylesheet" type="text/css" href="ui-darkness/jquery-ui-1.8.20.custom.css"/>
<script type="text/javascript" src="js/jquery-1.7.2.js">
</script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">
$(
function(){
    
//顯示一個對話框,具體的用法,請參考下載好ui包里面的demo用法來提升自己
$("#mydialog").dialog();
$("#tabBookList").tabs();
});
</script>
<body>
<!--對話框-->
<div id="mydialog">確認刪除嗎?</div>

<!--tab框①創建個層,ul下的li代表tab的標題,每個標題href="#具體內容層對應的ID"-->
<div id="tabBookList" style="width:60%;height:500px">
<ul>
<li><a href="#a">電子計算機書籍</a></li>
<li><a href="#b">數據庫書籍</a></li>
<li><a href="#c">熱門推薦的書籍</a></li>

<!--建對應的內容層-->
<div id="a"><input name="" type="text" />電子計算機書籍列表電子計算機書籍列表電子計算機書籍列表電子計算機書籍列表電子計算機書籍列表電子計算機書籍列表電子計算機書籍列表電子計算機書籍列表電子計算機書籍列表電子計算機書籍列表電子計算機書籍列表電子計算機書籍列表電子計算機書籍列表電子計算機書籍列表電子計算機書籍列表電子計算機書籍列表</div>
<div id="b">數據庫書籍列表數據庫書籍列表數據庫書籍列表數據庫書籍列表數據庫書籍列表數據庫書籍列表數據庫書籍列表數據庫書籍列表數據庫書籍列表數據庫書籍列表數據庫書籍列表數據庫書籍列表數據庫書籍列表數據庫書籍列表數據庫書籍列表數據庫書籍列表數據庫書籍列表數據庫書籍列表數據庫書籍列表數據庫書籍列表數據庫書籍列表數據庫書籍列表數據庫書籍列表數據庫書籍列表</div>
<div id="c">熱門推薦的書籍列表熱門推薦的書籍列表熱門推薦的書籍列表熱門推薦的書籍列表熱門推薦的書籍列表熱門推薦的書籍列表熱門推薦的書籍列表熱門推薦的書籍列表熱門推薦的書籍列表</div>
</ul>
</div>

</body>
</html>

 

 Jquery第一期下載地址: http://download.csdn.net/download/yangyanghaoran/4424796

八、 C# Winform篇

     

       8.1  跟鼠標屬性相關的,主要是閃爍頻率,雙擊間隔,鼠標鍵數等

         DllImport是導入外部dll,你只管輸入DllImport,然后光標置入那里,按Shift+alt+F10即可導入命名空間,本例並不難,如果初次見到DllImport可能你很難理解,這個在C#winform中經常見,要習慣,有時候要播放聲音,就可以這樣,至於用法,本期不講

[DllImport("winmm.dll", EntryPoint = "mciSendString")]
private static extern Int32 mciSendString(String lpstrCommand, String lpstrReturnString, Int32 uReturnLength, Int32 hwndCallback);

都很類似,要習慣的

 

 

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;
using System.Runtime.InteropServices;

namespace mainFrm
{
    public partial class form001 : Form
    {
        public form001()
        {
            InitializeComponent();
        }

        //用 [ ] 在一個方法或屬性上叫做特性  attribute
        //導入一個類庫
        [DllImport("user32", EntryPoint = "GetDoubleClickTime")] //指示要調用的DLL入口點的名稱和序號,鼠標雙擊間隔
        public extern static int GetDoubleClickTime();

        [DllImport("user32", EntryPoint = "GetCaretBlinkTime")] //光標閃爍的頻率
        public extern static int GetCaretBlinkTime();

        //GetSystemMetrics函數主要用來返回與windows環境相關的信息,43代表鼠標的鍵數
        [DllImport("user32", EntryPoint = "GetSystemMetrics")]
        public extern static int GetSystemMetrics(int intcount);


        private void form001_Load(object sender, EventArgs e)
        {
            //鼠標間隔
            lbldoubleClick.Text = GetDoubleClickTime().ToString() + "毫秒";
            //光標頻率
            lblCaretBlink.Text = GetCaretBlinkTime().ToString() + "毫秒";

            //鼠標鍵數
            lblKeyCount.Text = GetSystemMetrics(43).ToString()+"";

            //設置此范圍內光標為等待光標
            panel1.Cursor = Cursors.WaitCursor;

        }

        /// <summary>
        ///鼠標在窗體上按下時
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        private void form001_MouseDown(object sender, MouseEventArgs e)
        {
            this.lblMouseLocation.Text = "(" + e.X + "," + e.Y + ")";
            if (e.Button == MouseButtons.Left)
            {
                rtbRecord.Text += DateTime.Now.ToString("hh時mm分ss秒") + "按下鼠標左鍵!\n";
                rtbRecord.Select(rtbRecord.TextLength, 0);
            }
            else if (e.Button == MouseButtons.Right)
            {
                rtbRecord.Text += DateTime.Now.ToString("hh時mm分ss秒") + "按下鼠標右鍵!\n";
                rtbRecord.Select(rtbRecord.TextLength, 0);
            }
            else if (e.Button == MouseButtons.Middle)
            {
                rtbRecord.Text += DateTime.Now.ToString("hh時mm分ss秒") + "按下鼠標中鍵!\n";
                rtbRecord.Select(rtbRecord.TextLength, 0);
            }
        }
    }
}

 

     8.2 截取系統消息和自定義靜態cur 鼠標樣式

           實現IMessageFilter接口,或者重寫 本窗體的WndProc方法來截取windows消息,根據截取的消息的消息ID號,判斷是什么消息,然后做出處理

/******************************************************   
FileName(文件名):  清新空氣楊洋瘋狂學習C#系列
Copyright (版權) (c)  2011-2012 楊洋瘋狂學習C#
Writer(作者): 楊洋
create Date(創建日期): 2012-07-13
Rewriter(修改者): 楊洋
Rewrite Date(修改日期):2012-07-13
Impact(影響): 網上有一類叫  鼠標手勢的軟件,我不知道是不是截獲windows消息做的
Main Content(Function Name、parameters、returns)(主要內容(函數名稱、參數、返回值))
******************************************************/

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;

namespace mainFrm
{
    public partial class form002 : Form
    {
        public form002()
        {
            InitializeComponent();
        }
        //截取系統消息,有兩種手段
        //①通過在Form中重寫Control類的虛方法WncProc來截取Windows信息
        //②通過實現IMessageFilter接口來創建消息篩選器,從而截取Windows消息
        MessageFilter mf = new MessageFilter();


        //窗體加載一個消息篩選器
        private void form002_Load(object sender, EventArgs e)
        {
            ////添加消息篩選器以便在向目標傳送 Windows 消息時監視這些消息
            Application.AddMessageFilter(mf);   //如果想查看鼠標替換后的樣子,請先將這行代碼注視
          
        }

        //從窗體中移除一個消息篩選器
        private void form002_FormClosing(object sender, FormClosingEventArgs e)
        {
            //從應用程序的消息泵移除一個消息篩選器
            Application.RemoveMessageFilter(mf);
        }

        private void button1_Click(object sender, EventArgs e)
        {
            this.Cursor = new Cursor(Environment.CurrentDirectory + @"\images\cursor\pen_il.cur");  //指定新的鼠標樣子
        }


        ////方法一,重寫WndProc虛方法,與方法二不可同時存在
        //protected override void WndProc(ref Message m)
        //{
        //    switch (m.Msg)//判斷系統消息的ID號
        //    {
        //        case 513:
        //            MessageBox.Show("第一種方式單擊了鼠標左鍵!", "系統信息");
        //            m.Result = (IntPtr)0;//為了響應消息處理而向 Windows 返回的值
        //            break;
        //        case 516:
        //            MessageBox.Show("第一種方式單擊了鼠標右鍵!", "系統信息");
        //            m.Result = (IntPtr)0;//為了響應消息處理而向 Windows 返回的值
        //            break;
        //        default:
        //            base.WndProc(ref m);
        //            break;
        //    }
        //}

        //這里我把方法1注釋掉了,如果用方法1來實現,只需要這一個方法就行了,如果用方法2,除了WndProc這個重寫的方法不用寫其他都要

        //關於Wnd 我自己記憶的方法就是   Window,我讀也讀window,proc我理解我進程process


    }

    //方法二,實現IMessageFilter接口,從而獲得Windows消息,與方法一不可同時存在
    public class MessageFilter : IMessageFilter
    {
        public bool PreFilterMessage(ref Message message)
        {
            switch (message.Msg)//判斷系統消息的ID號
            {
                case 513:
                    MessageBox.Show("第二種方式單擊了鼠標左鍵!", "系統信息");
                    return true;
                case 516:
                    MessageBox.Show("第二種方式單擊了鼠標右鍵!", "系統信息");
                    return true;
                default:
                    return false;
            }
        }

    }
}

 

 

 

     8.3 關於設置系統全局的鼠標圖標,還有設置本窗體的動態 ani格式的鼠標圖案,例如游戲中的鼠標圖標都是很個性化的

 

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;
using System.Runtime.InteropServices;
using System.Reflection;

namespace mainFrm
{
    public partial class Form003 : Form
    {
        public Form003()
        {
            InitializeComponent();
        }

        [DllImport("user32.dll")]
        public static extern IntPtr LoadCursorFromFile(string fileName);
private void button1_Click(object sender, EventArgs e)
        {
            #region 引入這段代碼,加上LoadCursorFromFile這個方法,就可以自定義動態鼠標
            Cursor myCursor = new Cursor(Cursor.Current.Handle);
            IntPtr colorCursorHandle = LoadCursorFromFile("0081.ani");//鼠標圖標路徑
            myCursor.GetType().InvokeMember("handle", BindingFlags.Public | BindingFlags.NonPublic | BindingFlags.Instance | BindingFlags.SetField, null, myCursor, new object[] { colorCursorHandle });
            this.Cursor = myCursor; 
            #endregion
        }

        private void button2_Click(object sender, EventArgs e)
        {
            this.Cursor = Cursors.Default;
        }


        //替換系統默認的鼠標圖案
        [DllImport("user32", EntryPoint = "LoadCursorFromFile")]
        public static extern int IntLoadCursorFromFile(string lpFileName);

        [DllImport("user32", EntryPoint = "SetSystemCursor")]
        public static extern void SetSystemCursor(int hcur, int i);


        //已知 OCR_HAND標識符的 值為32649
        const int OCR_HAND = 32649;

        private void button3_Click(object sender, EventArgs e)
        {
            //新的圖標地址,請事先把你的圖標放在C:\WINDOWS\Cursors\下,然后再設置
            string handpath = @"C:\WINDOWS\Cursors\wait_r.cur";
            //通過IntLoadCursorFromFile(新的圖片路徑)將圖片轉換成數字
            int num = IntLoadCursorFromFile(handpath);
            //存值
            SetSystemCursor(num, OCR_HAND);

            //如果沒效果,請移到能夠超鏈接的地方試試,不僅在本窗口,在系統的其他地方也行
        }

        private void button4_Click(object sender, EventArgs e)
        {

            int num = IntLoadCursorFromFile(@"C:\WINDOWS\Cursors\arrow_i.cur");
            //存值
            SetSystemCursor(num, 32512);  //32512代表箭頭
        }
    }
}

 

 

 

     8.4 限制鼠標移動范圍  Cursor.Clip 

        本人試過,如果是子窗體化顯示,會有問題,鼠標可以逃脫本窗體的范圍;如果正常顯示窗體,就沒問題

        

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;

namespace mainFrm
{
    public partial class Form004 : Form
    {
        public Form004()
        {
            InitializeComponent();
        }


        //Cursor內有很多屬性,有個叫Clip的屬性用來限制鼠標移動范圍,   ,Current用來獲得當前鼠標Cursor對象
        private void button1_Click(object sender, EventArgs e)
        {
            this.Cursor = new Cursor(Cursor.Current.Handle);
            Cursor.Position = new Point(Cursor.Position.X,Cursor.Position.Y);   //獲取或者設置光標位置
            Cursor.Clip = new Rectangle(this.Location, this.Size); //Rectangle 類型很重要,后面常見的有四個參數,(起始x坐標,起始Y坐標,寬度,高度)
        }

        private void button2_Click(object sender, EventArgs e)
        {
            //獲取屏幕信息
            Screen[] screen = Screen.AllScreens;  //因為現在有多屏顯示操作
            this.Cursor = new Cursor(Cursor.Current.Handle);
            Cursor.Clip = screen[0].Bounds;         

        }
    }
}

 

 

 

       

   8.5 播放器上的鼠標,鼠標停留停留在播放器界面上,不移動的話,會自動隱藏      user32.dll 的  ShowCursor函數

 

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;
using System.Runtime.InteropServices;

namespace mainFrm
{
    public partial class Form005 : Form
    {
        public Form005()
        {
            InitializeComponent();
        }
        //本功能在播放器上經常看到
        [DllImport("user32", EntryPoint = "ShowCursor")]
        public extern static bool ShowCursor(bool bShow);

        //隱藏
        private void button1_Click(object sender, EventArgs e)
        {
            ShowCursor(false);
        }
        //顯示
        private void button2_Click(object sender, EventArgs e)
        {
            ShowCursor(true);
        }

        private void Form005_Load(object sender, EventArgs e)
        {

        }
    }
}

 

 

 

   8.6 SendKey類的使用,該類我感覺就像用代碼去按某個鍵那樣,具體用法可參考msdn

    我自己摘抄了一個MSDN的Sendkey的其他參數列表 ,不過有點亂

     http://www.cnblogs.com/Fresh-Air/archive/2012/05/12/2497653.html

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;

namespace mainFrm
{
    public partial class form006 : Form
    {
        public form006()
        {
            InitializeComponent();
        }

        private void form006_DoubleClick(object sender, EventArgs e)
        {
            SendKeys.Send("{tab}");
        }
    }
}

 

 

 

   8.7  簡單的文本框文字的拖放,不怎么樣主要是思想

/******************************************************   
FileName(文件名):  清新空氣楊洋瘋狂學習C#系列
Copyright (版權) (c)  2011-2012 楊洋瘋狂學習C#
Writer(作者): 楊洋
create Date(創建日期): 2012-07-13
Rewriter(修改者): 楊洋
Rewrite Date(修改日期):2012-07-13
Impact(影響): 本例子主要用到了TextBox控件的DoDragDrop方法,DragEventArgs類的Data屬性和Effect屬性以及DataObject類的GetData方法
 *                      DragEventArgs類包含與所有拖放事件(DragEnter、DragLeave,DragOver和Drop)相關的參數,Data屬性用來獲取一個數據對象,該對象包含與對應拖動事件關聯的數據
Main Content(Function Name、parameters、returns)(主要內容(函數名稱、參數、返回值))
******************************************************/

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;

namespace mainFrm
{
    public partial class form007 : Form
    {
        public form007()
        {
            InitializeComponent();
        }

        private void form007_Load(object sender, EventArgs e)
        {

        }
        //第一步
        private void textBox1_MouseMove(object sender, MouseEventArgs e)
        {
            //寫在移動事件里,移動的時候判斷鼠標左鍵是否按下
            if (e.Button == MouseButtons.Left)
            {
                //可以設置鼠標樣式
                //this.Cursor = new Cursor("新地址");
                DragDropEffects dropEffect = this.textBox1.DoDragDrop(this.textBox1.Text, DragDropEffects.Copy );      //DoDragDrop開始進行拖放操作  
            }
        }


        //第二步,當有東西被拖着,經過文本框2時的事件,將鼠標圖標換成可復制的,請講文本框2的AllowDrop屬性設為true
        private void textBox2_DragEnter(object sender, DragEventArgs e)
        {
            e.Effect = DragDropEffects.Copy;   //到目前為止看看是不是有點小效果了,但是數據還沒有過來,沒事,第三步
        }


        //在文本框2上拖拽結束,釋放鼠標左鍵時,也就是我們賦值的時候
        private void textBox2_DragDrop(object sender, DragEventArgs e)
        {
            //來吧,最后一步了
            textBox2.Text = e.Data.GetData(DataFormats.Text).ToString();    //DataFormat中含有很多數據格式,我選了個文本

        }

        //本次也是以后拖放學習的基本思路


        //關於文本框在啰嗦幾個吧
        //1.    AcceptReturn屬性    如果是true的話,此文本框內可以按回車鍵,表示換行
    }
}

 

   8.8  網上有一類叫 教鞭的軟件,可以在屏幕上畫東西教學使用,這里只是提供一個簡單的思路,在窗體上畫畫

/******************************************************   
FileName(文件名):  清新空氣楊洋瘋狂學習C#系列
Copyright (版權) (c)  2011-2012 楊洋瘋狂學習C#
Writer(作者): 楊洋
create Date(創建日期): 2012-07-13
Rewriter(修改者): 楊洋
Rewrite Date(修改日期):2012-07-13
Impact(影響): 網上有一類叫  教鞭的軟件,可以在屏幕上畫東西教學使用,這里只是提供一個簡單的思路
 * 我覺得那個教鞭就是,先截圖,然后當此窗體的背景,然后窗體最大化,然后你們可以繪圖了
Main Content(Function Name、parameters、returns)(主要內容(函數名稱、參數、返回值))
******************************************************/
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;

namespace mainFrm
{
    public partial class Form008 : Form
    {
        public Form008()           //此處為窗體的構造函數,我理解是最先執行的地方,窗體沒顯示就執行了
        {
            InitializeComponent();

            //初始化信息
            pen = new Pen(Color.FromName("black"));//始末畫筆 ,當然你可以提供顏色供用戶選了
            graphics = CreateGraphics();//初始畫板
        }


      public  bool isPressed = true;  //判斷在鼠標移動的時候是否鼠標左鍵是否按下
        public Point lastPoint = Point.Empty;//定義繪圖開始點
        public Pen pen;//聲明畫筆
        public Graphics graphics;//聲明繪圖對象

        //畫東西,你的鼠標是不是要不停的移動,當然選擇這個事件了,思路和上一個拖放文本很像
        private void Form008_MouseMove(object sender, MouseEventArgs e)
        {
            if (lastPoint.Equals(Point.Empty))//判斷繪圖開始點是否為空
            {
                lastPoint = new Point(e.X, e.Y);//記錄鼠標當前位置
            }
            if (isPressed)//開始繪圖
            {
                Point cruuPoint = new Point(e.X, e.Y);//獲取鼠標當前位置
                graphics.DrawLine(pen, cruuPoint, lastPoint);//繪圖
            }
            lastPoint = new Point(e.X, e.Y);//記錄鼠標當前位置
        }

        private void Form008_MouseDown(object sender, MouseEventArgs e)
        {
            isPressed = true;
        }

        private void Form008_MouseUp(object sender, MouseEventArgs e)
        {
            isPressed = false;
        }



    }
}

 

 

 

   8.9 用代碼將鼠標的指針移動,單擊,或者其他的,不是人工的,很想按鍵精靈,網上有一種工具,記住你的操作步驟,然后它可以照你剛才的操作重復執行,本次用到了mouse_event   API函數

 

/******************************************************   
FileName(文件名):  清新空氣楊洋瘋狂學習C#系列
Copyright (版權) (c)  2011-2012 楊洋瘋狂學習C#
Writer(作者): 楊洋
create Date(創建日期): 2012-07-13
Rewriter(修改者): 楊洋
Rewrite Date(修改日期):2012-07-13
Impact(影響): 網上有一類叫  按鍵精靈的東西,記住你的按鍵,重復你的動作,本例子只是讓鼠標自動上移而已
Main Content(Function Name、parameters、returns)(主要內容(函數名稱、參數、返回值))
******************************************************/
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;
using System.Runtime.InteropServices;

namespace mainFrm
{
    public partial class Form009 : Form
    {
        public Form009()
        {
            InitializeComponent();
        }

//本例主要用到了API函數mouse_event [DllImport("user32.dll")] public static extern int mouse_event(int dwFlags,int dx,int dy,int dwData,int dwExtraInfo); //列出幾個 const int MOUSEEVENTF_MOVE = 0x0001; const int MOUSEEVENTF_LEFTDOWN = 0x0002; const int MOUSEEVENTF_LEFTUP = 0x0004; private void btnMouseUp_Click(object sender, EventArgs e) { mouse_event(MOUSEEVENTF_MOVE, -80, -20, 0, 0);//模擬移動鼠標  mouse_event(MOUSEEVENTF_LEFTDOWN, 0, 0, 0, 0);//第一次鼠標左鍵按下 mouse_event(MOUSEEVENTF_LEFTUP, 0, 0, 0, 0);//第一次鼠標左鍵松開 mouse_event(MOUSEEVENTF_LEFTDOWN, 0, 0, 0, 0);//第二次鼠標左鍵按下 mouse_event(MOUSEEVENTF_LEFTUP, 0, 0, 0, 0);//第二次鼠標左鍵松開 //當然你可以自動觸發,鼠標任意動作了 //這里先移動,然后雙擊停下來的位置 //mouse_event 第一個參數請參考表格 } private void Form009_DoubleClick(object sender, EventArgs e) { //MessageBox.Show("您的鼠標發生了自動上移,並雙擊了窗體一次!"); } } }

   8.10 鼠標透過窗體,順便學習,window桌面右下角有小圖標,並且右擊會有個性化的菜單的制作

  

/******************************************************   
FileName(文件名):  清新空氣楊洋瘋狂學習C#系列
Copyright (版權) (c)  2011-2012 楊洋瘋狂學習C#
Writer(作者): 楊洋
create Date(創建日期): 2012-07-13
Rewriter(修改者): 楊洋
Rewrite Date(修改日期):2012-07-13
Impact(影響): 
 * ①新建窗體,拖一個 notifyIcon   和   ContextMenuStrip 控件,指定notifyIcon的ico圖標和它的菜單,即ContextMenuStrip這個快捷菜單
 * ② 放入一些需要         欲取回的信息的   nIndex的值
 * ③ 放入   SetWindowLong 和 GetWindowLong   兩個api函數
Main Content(Function Name、parameters、returns)(主要內容(函數名稱、參數、返回值))
******************************************************/
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;
using System.Runtime.InteropServices;

namespace mainFrm
{
    public partial class Form010 : Form
    {
        public Form010()
        {
            InitializeComponent();

            //指定小圖標的頭像和右鍵菜單,用NotifyIcon控件可以做出QQ最小化的那種效果,當然本例主要不是做這個
            this.ntfMenu.Icon = new Icon(@"images\2.ico");
            this.ntfMenu.ContextMenuStrip = this.cmsBackMenu;
            //使窗體最大化,且無邊框
            this.WindowState = FormWindowState.Maximized;
            this.FormBorderStyle = FormBorderStyle.None;
            //窗體透明度設置60%
            this.Opacity = 0.6;     //如果對於陌生的屬性不認識,不知道怎么賦值時,那么將鼠標移動到此屬性上,vs會有提示的,看它需要什么類型的,給它就行了

        }


        #region 基本常量   第一步
        private const uint WS_EX_LAYERED = 0x80000;
        private const int WS_EX_TRANSPARENT = 0x20;
        private const int GWL_EXSTYLE = (-20);
        private string tsmiName = "";//記錄當前操作的類型
        #endregion

        #region 第二步
        #region 在窗口結構中為指定的窗口設置信息
        /// <summary>
        /// 在窗口結構中為指定的窗口設置信息
        /// </summary>
        /// <param name="hwnd">欲為其取得信息的窗口的句柄</param>
        /// <param name="nIndex">欲取回的信息</param>
        /// <param name="dwNewLong">由nIndex指定的窗口信息的新值</param>
        /// <returns></returns>
        [DllImport("user32", EntryPoint = "SetWindowLong")]
        private static extern uint SetWindowLong(IntPtr hwnd, int nIndex, uint dwNewLong);
        #endregion

        #region 從指定窗口的結構中取得信息
        /// <summary>
        /// 從指定窗口的結構中取得信息
        /// </summary>
        /// <param name="hwnd">欲為其獲取信息的窗口的句柄</param>
        /// <param name="nIndex">欲取回的信息</param>
        /// <returns></returns>
        [DllImport("user32", EntryPoint = "GetWindowLong")]
        private static extern uint GetWindowLong(IntPtr hwnd, int nIndex);
        #endregion
        #endregion

        #region 第三步,調用那兩個函數,使窗口有鼠標穿透功能
        /// <summary>
        /// 使窗口有鼠標穿透功能
        /// </summary>
        private void CanPenetrate()
        {
            uint intExTemp = GetWindowLong(this.Handle, GWL_EXSTYLE);
            uint oldGWLEx = SetWindowLong(this.Handle, GWL_EXSTYLE, WS_EX_TRANSPARENT | WS_EX_LAYERED);
        }

        //窗體初始化時觸發事件
        private void Form010_Load(object sender, EventArgs e)
        {
            this.TopMost = true;//使窗體始終在其它窗體之上
            this.ShowInTaskbar = false;//窗體的縮略圖不出現在Windows任務欄中
            CanPenetrate();   //開始使鼠標透過窗體
        }
        #endregion

        #region 第四步,寫菜單的事件,當然菜單上有很多要單擊的菜單項,我們不可能為每個菜單項都寫吧,此處是winform最常用的一個寫法,必須弄懂,在winform中,同一類型的對象,可以同時調用同一個事件,為了區分是哪個對象,有時候就根據某些對象的我們在界面端設置的tag值作為判斷或者作為賦值依據,總歸有用
        #region 設置顏色和透明度的狀態
        /// <summary>
        /// 設置顏色和透明度的狀態
        /// </summary>
        private void SetEstate(Form Frm, object sender)
        {
            tsmiName = ((ToolStripMenuItem)sender).Name;            //這里的sender   是事件源,就像我們說過的 jquery篇里面的 e.target,不過這里我們需要將sender強制轉換成ToolStripMenuItem類型的,不是隱式轉換的,轉換成功后,我們就可以調用事件源里面的屬性或者方法了
           //關於轉換,下面還有方法比較好,也建議這么用
         
            //   ToolStripMenuItem tsmiTemp = sender as ToolStripMenuItem;//這里如果轉換失敗,tsmiTemp會是null的,但不會報異常
            //   if(tsmiTemp!=null){
            //   ...............
            //   }
            
            //這里根據菜單項對象的名稱判斷的,然后動態選擇執行哪些代碼
            
            string Tem_Str = tsmiName;
            if (tsmiName.IndexOf('_') >= 0)
            {
                tsmiName = Tem_Str.Substring(0, Tem_Str.IndexOf('_'));
            }

            switch (tsmiName)
            {
                case "ToolColor":          //如果是設置顏色一類的
                    {
                        Color Tem_Color = Color.Gainsboro;
                        switch (Convert.ToInt32(((ToolStripMenuItem)sender).Tag.ToString()))
                        {
                            case 1: Tem_Color = Color.Gainsboro; break;
                            case 2: Tem_Color = Color.DarkOrchid; break;
                            case 3: Tem_Color = Color.RoyalBlue; break;
                            case 4: Tem_Color = Color.Gold; break;
                            case 5: Tem_Color = Color.LightGreen; break;
                        }
                        Frm.BackColor = Tem_Color;
                        break;
                    }
                case "ToolClarity":      //如果是設置透明度
                    {
                        double Tem_Double = 0.0;
                        switch (Convert.ToInt32(((ToolStripMenuItem)sender).Tag.ToString()))
                        {
                            case 1: Tem_Double = 0.1; break;
                            case 2: Tem_Double = 0.2; break;
                            case 3: Tem_Double = 0.3; break;
                            case 4: Tem_Double = 0.4; break;
                            case 5: Tem_Double = 0.5; break;
                            case 6: Tem_Double = 0.6; break;
                            case 7: Tem_Double = 0.7; break;
                            case 8: Tem_Double = 0.8; break;
                            case 9: Tem_Double = 0.9; break;

                        }
                        Frm.Opacity = Tem_Double;
                        break;
                    }
                case "ToolAcquiescence":
                    {
                        Frm.BackColor = Color.Gainsboro;
                        Frm.Opacity = 0.6;
                        break;
                    }
                case "ToolClose":
                    {
                        Close();
                        break;
                    }

            }
        }
        #endregion

        #endregion


        #region 第五步,寫個方法,調用這里面的方法,並且在界面那一端,將所有的要單擊的menu中的菜單項的click事件都指向這個事件
        private void ToolClarity_10_Click(object sender, EventArgs e)
        {
            SetEstate(this, sender);
        }
        #endregion
        /// <summary>
        /// 關閉窗體
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        private void ToolClose_Click(object sender, EventArgs e)
        {
            this.Close();
        }
    }
}

 

 

 

   8.11 無邊框窗體可以被拖動+右鍵菜單

 我的其中一個學習方法: 不要死記硬背,記住需要哪些代碼,怎么用即可,這些代碼我保存成文檔了,這個文檔我的存放位置就行了,這就導致了,有的我會寫,但是不給我網絡,不給我看書,我就記不起來了,立即叫你口述就完了。

/******************************************************   
FileName(文件名):  清新空氣楊洋瘋狂學習C#系列
Copyright (版權) (c)  2011-2012 楊洋瘋狂學習C#
Writer(作者): 楊洋
create Date(創建日期): 2012-07-13
Rewriter(修改者): 楊洋
Rewrite Date(修改日期):2012-07-13
Impact(影響): 右鍵菜單:①拖一個ContextMenuStrip控件,界面上單擊窗體,找到ContextMenuStrip屬性,右邊下拉框選擇一個菜單就行了
 * ②后台指定
Main Content(Function Name、parameters、returns)(主要內容(函數名稱、參數、返回值))
******************************************************/
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;
using System.Runtime.InteropServices;

namespace mainFrm
{
    public partial class Form011 : Form
    {
        public Form011()
        {
            InitializeComponent();
            this.ContextMenuStrip = this.contextMenuStrip1;
        }

        #region 第一步
        [DllImport("user32.dll")]
        public static extern bool ReleaseCapture();//用來釋放被當前線程中某個窗口捕獲的光標
        [DllImport("user32.dll")]
        public static extern bool SendMessage(IntPtr hwdn, int wMsg, int mParam, int lParam);
        #region 本程序中需要聲明的變量
        public const int WM_SYSCOMMAND = 0x0112;//該變量表示將向Windows發送的消息類型
        public const int SC_MOVE = 0xF010;//該變量表示發送消息的附加消息
        public const int HTCAPTION = 0x0002;//該變量表示發送消息的附加消息
        #endregion
   
        #endregion

        #region 第二步 在窗體的鼠標按下事件中放入以下這段代碼即可
        //向指定的窗體發送Windows消息
        private void Form011cs_MouseDown(object sender, MouseEventArgs e)
        {
            ReleaseCapture();//用來釋放被當前線程中某個窗口捕獲的光標
            SendMessage(this.Handle, WM_SYSCOMMAND, SC_MOVE + HTCAPTION, 0);//向Windows發送拖動窗體的消息
        }
        #endregion

        private void 關閉ToolStripMenuItem_Click(object sender, EventArgs e)
        {
            this.Close();
        }
    }
}

 

winform篇下載地址:http://download.csdn.net/detail/yangyanghaoran/4427076

 

待編寫的...

   8.11鈎子的安裝和釋放技術和系統熱鍵的接觸和屏蔽技術

   8.12 鼠標設置器,就是類似於window控制面板中的鼠標那一項的東東。

 

 

十、 C# .net框架篇

          --------------------------------------------------------SubSonic篇----------------------------------------------------------------------------------

         SubSnoic 框架入門到提高(1)---全程記錄

         SubSnoic 框架入門到提高(2)---全程記錄

         SubSnoic 框架入門到提高(3)---全程記錄

         SubSnoic 框架入門到提高(4)---全程記錄

 

更正一下錯誤:   &邏輯判斷符號,先執行兩側表達式,再判斷;&&先執行左側,再判斷,需要時再執行右側表達式 ,同理|  和  || 一樣的道理

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM