上學時的HTML+JS+CSS(小總結)

html:超文本標記語言
基本標籤：
{
文本標籤：<pre></pre>:原封不動的保留空白區域。
     <br />:換行。
     <hr width="寬度(單位:%)" size="高度" noshade(該行不帶陰影) color="線條顏色" />:在文檔中畫一條水平線，可用來          分割文檔。
     <strong></strong>:加粗。
     <em></em>:斜體。
     <marquee direction="滾動方向(left/right/up/down)" loop="循環次數(-1表明無限循環)" behavior="滾動形式          (scroll:普通/alternate:來回滾動/slide:文字滾動出來再也不動)" scrolldelay="每次循環的間隔時                    間"></marquee>:設置文字滾動。
圖像標籤：<img src="圖像的url(地址)" alt="簡短的描述，當圖像不能顯示時在圖像位置出現給圖像的提示內容或文本信息"           width="寬度" hright="高度" />
超連接：<a href="http://www.baidu.com"></a>{定義錨點:<a href="錨點名"></a>，連接到錨點:<a href="#錨點名"></a>}
框架標籤：frameset與body相沖突，不能同時存在。
     <frameset rows="222,*" frameborder="yes"></frameset>[rows:將框架集分爲幾個水平的框架，*表明餘下的部 分。          cols:將框架集分爲幾個垂直的框架。frameborder：是否顯示邊框，取值爲yes或no。border:邊框的寬度。]
     <frame name="框架名稱" src="框架內容的連接" frameborder="框架邊框的寬度" noresize(不可改變邊框的大小)                     scrolling="滾動條設置，取值爲auto/yes/no" />
     浮動框架:iframe與frameset不能混用。
     <iframe name="浮動框架" src="框架內容的連接" frameborder="框架邊框的寬度" width="300" height="200"           align="right">
     </iframe>
表單標籤：
     多行文本框：<textarea name="名稱" cols="高度" rows="寬度">請輸入</textarea>
     下拉列表：<select name="名稱" selected="默認值">
               <option >內容</option>
            </select>
     文本框:<input type="text" name="名稱" />
     密碼框:<input type="password" name="名稱" />
     單選框:<input type="radio" name="名稱" />(設置name需相同  在同一個form下)
     多選框:<input type="checkbox" name="名稱" />(設置name不能相同)
     提交按鈕:<input type="submit" name="名稱" />
     重置按鈕:<input type="reset" name="名稱" />
     圖像按鈕:<input type="image" name="名稱" />
     普通按鈕:<input type="button" name="名稱" />
     maxlength:能夠限制輸入的字符數。readonly:設置只讀文本。
表格標籤：<table border="邊框寬度" width="寬度" cellpadding="填充" cellspacing="間距" bordercolor="邊框顏色" bgcolor="背景顏色">
   <caption align="top"><h1><font color="red">商品簡介</font></h1></caption>肯定題注位置，必須包含在 table內且必須緊跟在table開始標記以後。
   <colgroup><col span="列數" /><col span="1" /></colgroup>跨列修飾
    <tr>行元素
       <td>商品</td>列元素
    </tr>
   </table>
     建立不規則表格：colspan:水平跨列，rowspan:垂直跨行。只能出如今td或th中。
熱點區域：<map></map>.
     <img src="圖像地址" usemap="(映像名，需與name名相同。)#ditu" />
       <map name="ditu">
          <area shape="圖形名稱(rect:矩形/circ:圓形/poly:多邊形)" coords="熱點的座標範圍：343,155,371,175" href="http://www.kuaibo.com" />
       </map>
div層和列表：<div></div>（塊級元素，容器，佔用資源）:屬性:position:absolute絕對定位/position:relative相對定位。{圖層 （浮動、廣告）}
     <span ></span>:設置同一行文字的不一樣格式。
     定義列表：<dl>
                <dt>名稱<dd>說明文字
            </dl>
     無序列表：<ul>
                <li>名稱</li>
            </ul>

     有序列表：<ol>
                <li>名稱</li>
            </ol>

     目錄列表：<dir>
                <li>名稱</li>
            </dir>

     菜單列表：<menu>
                <li>名稱
            </menu>
}
-------------------------------------------------------------------------------------------------------------------
css：層疊樣式表，級聯樣式表，簡稱樣式表。
鏈入外部樣式：<link rel="stylesheet" type="text/css" href="樣式表文件的地址" />
css僞類：（必須寫在style標記以內）
     <style type="text/css">
          a:link{未訪問過的連接};
          a:hover{鼠標通過時};
          a:active{鼠標點擊不鬆開時};
          a:visited{已訪問過的連接};
     </style>
設計列表樣式：list-style-type:disc(列表符號位黑圓點)/circle(空心圓點)
添加列表圖像：list-style-image:none(不適用圖像符號)/url（指定圖像路徑）
調整列表位置：list-style-position:outside(不向內縮進，默認值)/inside(向內縮進)
清除：clear:left(不容許某元素的左邊有浮動元素）/right(不容許某元素的右邊有浮動元素)/both(某元素的左右兩邊都不容許有     浮動元素)/none(某元素的左右兩邊都容許有浮動元素)
設置層空間：z-index:數字（z-index要與position:absolute配合使用）
設置層裁切：clip:rect(裁切的矩形四個頂點，上右下左)
-------------------------------------------------------------------------------------------------------------------
js(javascript):一種基於對象和事件驅動的解釋性腳本語言(逐行翻譯)。
腳本數據類型：數字類型：number
           字符串類型:string
           布爾類型:boolean
           未定義:undefined
           空:null
           數組:array
           對象:object
內置對象：<script type="text/javascript">
     var str = "welcomeo JoCXY";
     //alert(str.substring(str.indexOf("c"),str.lastIndexOf("e")+1));

     //alert(str.substring(0,str.lastIndexOf("o")) + "a" + str.substring(str.lastIndexOf("o")+1,str.length));
//String對象
          //小寫轉換
                    //alert(str.toLowerCase());
          //大寫轉換
                    //alert(str.toUpperCase());
          //獲取指定位置字符[從0開始.]
                    //alert(str.charAt(5));
          //獲取指定位置字符編碼
                    //alert(str.charCodeAt(5));       
          //正向索引位置
                    //alert(str.indexOf("m"));
          //反向索引位置
                    //alert(str.lastIndexOf("o"));
          //獲取匹配字符串[若沒有匹配的字符串則返回null.]
                    //alert(str.match("come"));
          //獲取匹配字符串的首字母索引
                    //alert(str.search("JoCXY"));
          //截取[從第3個字符開始截取,截取了4個字符.]
                    //alert(str.substr(3,4));
          //截取[從第3個字符開始截取,截取到第4個字符結束.]
                    //alert(str.substring(3,4));
          //截取[同substring相同.可以使用負數]
                    //alert(str.slice(-4))；//從-4位開始截取,截取到最後一位
                    //alert(str.slice(-4,-1));
          //替換
                    //alert(str.replace(str.substring(str.lastIndexOf("o")),"a"));
                   
                   
          //分割
                    //alert(str.split("o"));
          //鏈接
                    //alert(str.concat(3,4,5));
//Array對象
          //定義數組方式
               /*var arr = new Array();

               var arr = new Array(3);
               arr[0] = "lan";
               arr[1] = "tian";
               arr[2] = 222;
               alert(arr[2]);*/

               /*var arr = new Array(22,234,"lan",true);
               for(a = 0;a < 4;a++){
                    alert(arr[a]);
               }*/
//定義二維數組
               /*var arr = new Array(3);
               for(var a = 0;a < 3;a++){
                    arr[a] = new Array(2);
                         for(var b = 0;b < 2;b++){
                         arr[a][b] = a * b;    
                         }
               }*/
               //alert(arr);//0[第0行第1列],0[第0行第2列],0[第1行第1列],1[第1行第2列],0[第2行第1列],2[第2行第2列]
               //alert(arr[2][1]);//輸出第三行第一列的內容
              
  //定義數組
       var arr = new Array(21,12,"lan","tian");
       //鏈接[自定義]
               //alert(arr.join("-"));
       //鏈接[逗號]
               //alert(arr.toString());
       //鏈接[添加新數組]
               //alert(arr.concat(2,21,2));
       //反向數組
               //alert(arr.reverse());
       //將數組排序,並將結果保留到原數組中
               //alert(arr.sort());
       //截取
               //alert(arr.slice(0,1));
       //對指定位置進行刪除和插入
               /*arr.splice(2,1,3);
               alert(arr);*/
       //進出棧操做[插入.刪除操做]
               //數組末端插入
                    /*arr.push("火",7,"鳳凰");
                    alert(arr);*/
               //數組末端刪除
                    /*arr.pop();
                    arr.pop();
                    alert(arr);*/
               //數組首端插入
                    /*arr.unshift("戰");
                    alert(arr);*/
               //數組首端刪除
                    /*arr.shift();
                    alert(arr);*/
//Math對象
          //1~10隨機數
                 //alert(Math.random()*10);
          //四捨五入成整數
                 //alert(Math.round(Math.random()*10));
//Date對象
          var date = new Date();
   //獲取日期和時間
          //獲取當前時間
               alert(date.toLocaleString());
          //獲取年份數
               //alert(date.getFullYear());
          //獲取月份數[月份數從0開始.]
               //alert(date.getMonth());
          //獲取月天數
               //alert(date.getDate());
          //獲取星期天數
               //alert(date.getDay());
          //獲取小時數
               //alert(date.getHours());
          //獲取分鐘數
               //alert(date.getMinutes());
          //獲取秒數
               //alert(date.getSeconds());
          //獲取毫秒數
               //alert(date.getMilliseconds());
          //獲取
               //alert(date.getTime());
     //設置日期和時間
          //設置年份
               /*date.setFullYear(2014);
               alert(date);*/
          //設置月份
               /*date.setMonth(6);
               alert(date);*/
          //設置月天數
               /*date.setDate(6);
               alert(date);*/
          //設置小時數
               /*date.setHours(06);
               alert(date);*/
          //設置分鐘數
               /*date.setMinutes(06);
               alert(date);*/
          //設置秒數
               /*date.setSeconds(06);
               alert(date);*/
          //設置毫秒數
               /*date.setMilliseconds(2014);
               alert(date);*/
          //使用毫秒數設置date對象,並返回date
               /*date.setTime(2014);
               alert(date);*/
         
          //返回本地時間與用UTC表示當前日期的時間差,以分鐘爲單位.
                    /*date.getTimezoneOffset();
                    alert(date);*/
          //返回date對象的世界標準時間(UTC)的字符串表示.
                    /*date.toUTCString();
                    alert(date);*/
          //根據本地時間格式,把date對象轉換爲字符串.
                    /*date.toLocalString();
                    alert(date);*/
          //解析一個日期的字符串.
                    /*Date.parse();
                    alert(date);*/
          //返回date對象距世界標準時間(UTC)1970年1月1日午夜之間的毫秒數
                    /*Date.UTC();
                    alert(date);*/
              
/*驗證E-Mail地址
     [A."@"不能是第一個字符;
     B."."必須在"@"以後;
     C."."不能是最後一個字符;
     D."@"不能與"."相鄰;
     E."@"以前的字符不能超過20個.]*/
          /*var str = "students@jcxy.org";
          var a = str.indexOf("@");
          var b = str.indexOf(".");
         
          if(a != 0 && a < b && b != length-1 && b - a > 1 && a>0&&a<21){
               alert("郵箱地址格式正確");
               }else{alert("郵箱地址格式錯誤");}*/


//冒泡排序
          /*var arr = [100,36,23,188,7,56,18,99]
          for(var i = 0;i < arr.length;i++){
               for(var a = 0;a < arr.length - 1;a++){
                    if(arr[a] > arr[a + 1]){
                    var b = arr[a];
                    arr[a] = arr[a + 1];
                    arr[a + 1] = b;
                    }
                   
                    }
               }
          for(var i in arr){
                    document.write(arr[i] + "&nbsp;");
          }*/

//比較日期大小
               var date1 = "2013-12-27";
               var date2 = "2013-6-1";
               //建立日期格式
               var a = new Date(date1.split("-")[0]+"/"+date1.split("-")[1]+"/"+date1.split("-")[2]);
               alert(a.getTime());
               var b = new Date(date2.split("-")[0]+"/"+date2.split("-")[1]+"/"+date2.split("-")[2]);
               alert(b.getTime());
               if(a > b){
                    alert(a);
               }else{
                    alert(b);
               }
  </script>
-------------------------------------------------------------------------------------------------------------------
DHTML：定時器：週期性執行定時器：timerID = setInterval中止啓動的定時器clearInterval(timmerID)
            一次性執行定時器：timerID = setTimeout中止啓動的定時器clearTimeout(timmerID)
窗口大小和位置：window.moveTo(x,y)移動窗口到指定位置，單位爲像素。
          window.moveBy(x,y)向右移動x像素，向下移動y像素。參數爲負數時表示反方向移動。
          window.resizeTo(width,height)調整窗口大小爲指定大小。
          window.resizeBy(x,y)放大或縮小，參數爲負數時表示縮小。


=============
Cookie

var time = new Date();
var t = time.getTime()

 

==================

內置對象：
History對象------------------------------------------------------------------------------
history.length:屬性。用來記錄istory中緩存了多少個URL。
history.back():方法。返回上一頁。
history.forward():方法。前進一頁。
history.go(num):方法。前進或後退指定的頁數。當參數num大於0時，表示前進多少頁。反之則爲後退。參數等於0時表示刷新當前頁面。
window對象---------------------------------------------------------------------------------
window.open(url,name,config){打開新窗口。URL爲打開的超連接地址。name爲窗口名稱。config爲配置參 數：menubar--菜單條，toolbar--工具條，location--地址欄，directories--連接，status--狀態 欄，scrollbars--滾動條，resizeable--可調整大小。參數值均爲「yes」或「no」}
window.close():關閉窗口。
對話框================alert--提示框，confirm(str)--確認框，prompt(str,value)--確認框。
狀態欄================window.status=str。
滾動條================window.scrollTo(x,y)--一次性滾動窗口到指定位置，單位爲像素。window.scrollBy(ax,ay)--從當前位置開始，向右滾動ax像素，向下滾動ay像素。
document對象-------------------------------------------------------------------------------
document.forms[]集合屬性：form對象數組，存放文檔中全部表單。
document.images[]集合屬性：image對象屬性，存放文檔全部照片。
document.getElementById()方法：對擁有指定id的對象的引用。
document.getElementsByName()方法：對擁有指定name的對象的引用。
document.getElementsByTagName()方法：對擁有指定標籤的對象的引用。
對象事件-----------------------------------------------------------------------------------
鼠標事件：onclick--單擊，ondblclick--雙擊，onmousedown--鼠標按下，onmouseup--鼠標彈起，onmouseover--鼠標移入，onmouseout--鼠標移出。
鍵盤事件：onkeypress--按過鍵盤，onkeydown--鍵盤按下，onkeyup--鍵盤彈起。
狀態事件：onload--文檔家在完畢，onunload--退出文檔，onchange--值發生變化，onfocus--得到焦點，onblur--失去焦點，onresize--調整窗口大小，onsubmit--表單提交。
JS高級技巧總結
===================================================================================================
錯誤處理：Error對象-- 基本語法：例：
var lan = 7;
try{
     document.write(lan);//執行代碼
}
catch(e){//參數e爲Error錯誤對象。
     document.write("錯誤代碼："+(e.number&0xffff)+"<br />");//&0xffff表明將e.number與之位與操做，由於e.number是一個32位的二進制的數字，而只有低16位是真 正的錯誤代碼，而咱們須要將低16位二進制碼轉換成10進制的錯誤碼。
     document.write("錯誤message："+e.message+"<br />");
     document.write("錯誤description："+e.description+"<br />");//錯誤處理
}
finally{
     alert(lantian);//最終執行代碼，可省略。
}
=====================================
ActiveX對象：瀏覽器插件。-- FileSystemObject:文件系統對象。---------------------------------------------------------------------
建立文件系統對象的語法爲：var fso = new ActiveXObject("Scripting.FileSystemObject");
建立文件（文件夾）語法：
function fun(){
          var fso =new ActiveXObject("Scripting.FileSystemObject");
          var fldr = fso.CreateFolde(document.form1.txt.value);
          /*CreateFolde：建立文件夾。CreateTextFile：建立文件。*/
     }
Driver對象--------------------------------------------------------------------------------
VolumeName--磁盤的卷標。DriverLetter--磁盤代號。SerialNumber--磁盤序列號。DriverType--磁盤種 類【1--移動磁盤。2--本地磁盤。3--網絡磁盤。4--光驅。5--其餘。】FileSystem--磁盤使用的文件系統。TotalSize-- 磁盤的使用空間，返回字節數。FreeSpace--磁盤的可用空間，返回字節數。
Folder對象---------------------------------------------------------------------------------
fso.CreateFolder--建立文件夾。fso.DeleteFolder--刪除文件夾。fso.MoveFolder（指定文件夾，指定路 徑）--移動文件夾。fso.CopyFolder（源文件夾的路徑，指定複製路徑）--複製文件夾。fldr.Name--獲取文件夾的名字（屬性）。 fso.FolderExists--檢查文件夾是否存在。fso.GetFolder--得到Folder對象。 fso.GetParentFolderName--查找父文件夾名字。
File對象-----------------------------------------------------------------------------------
Name--文件名。Type--文件類型。Path--完整文件路徑。Attributes--文件屬性。DateCreated--建立日期。 DateLastAccessed--最後訪問日期。DateLastModified--最後修改日期。Size--文件大小。
建立文件語法----fso.CreateTextFile()。
打開文件語法----fso.OpenTextFile()。
讀取文件方法===================
fo.Read(charNum)--從文件當前位置讀取charNum個字符。
fo.ReadAll()--從文件對象fo讀取所有內容。
fo.ReadLine--從文件讀取一行。
fo.Skip(charNum)--讀取文件時跳過charNum個字符。
fo.SkipLine()--文件當前位置跳到下一行。
寫入文件方法====================
fo.Write(string)--向打開的文件寫入字符串string。
fo.WriteBlankLines(lineNum)--寫入lineNum個換行符。
fo.WriteLine(string)--寫入字符串string再加上換行符。

==============================================

塊元素(block element) ◎ address - 地址 ◎ blockquote - 塊引用 ◎ center - 居中對齊塊 ◎ div - 經常使用塊級容易，也是css layout的主要標籤 ◎ fieldset - form控制組 ◎ form - 交互表單 ◎ h1 - 大標題 ◎ h2 - 副標題 ◎ h3 - 3級標題 ◎ h4 - 4級標題 ◎ h5 - 5級標題 ◎ h6 - 6級標題 ◎ hr - 水平分隔線 ◎ isindex - input prompt ◎ noframes - frames可選內容，（對於不支持frame的瀏覽器顯示此區塊內容） ◎ noscript - 可選腳本內容（對於不支持script的瀏覽器顯示此內容） ◎ p - 段落 ◎ pre - 格式化文本 ◎ table - 表格 ◎ dl - 定義列表 ◎ dir - 目錄列表 ◎ ol - 排序表單 ◎ ul - 非排序列表（無序列表） ◎ menu - 菜單列表 內聯元素(inline element) ◎ a - 錨點 ◎ abbr - 縮寫 ◎ acronym - 首字 ◎ b - 粗體(不推薦) ◎ bdo - bidi override ◎ big - 大字體 ◎ br - 換行 ◎ cite - 引用 ◎ code - 計算機代碼(在引用源碼的時候須要) ◎ dfn - 定義字段 ◎ em - 斜體強調 ◎ font - 字體設定(不推薦) ◎ i - 斜體 ◎ img - 圖片 ◎ input - 輸入框 ◎ kbd - 定義鍵盤文本 ◎ label - 表格標籤 ◎ q - 短引用 ◎ s - 中劃線(不推薦) ◎ samp - 定義範例計算機代碼 ◎ select - 項目選擇 ◎ small - 小字體文本 ◎ span - 經常使用內聯容器，定義文本內區塊 ◎ strike - 中劃線 ◎ strong - 粗體強調 ◎ sub - 下標 ◎ sup - 上標 ◎ textarea - 多行文本輸入框 ◎ tt - 電傳文本 ◎ u - 下劃線 ◎ var - 定義變量