前端學習小結（一）—基礎入門篇

 

1.前端入門-HTML

HTML5的新特性，要知道：輸入型別input（url，email，number，range..），表單屬性（autocomplete，novalidate）,表單元素（datalist，keygen，output）等的新增的新特性。不一一解釋，（http://www.w3school.com.cn/html5/index.asp）詳細見文件。

2.前端入門-CSS

CSS是層疊樣式表。其定義瞭如何顯示HTML元素，解決內容與表現分離的問題。存放CSS樣式的為樣式表，一般存放在CSS檔案中。可以從外部引入樣式表，或者直接在頁面中內部樣式表。

基礎使用 ：selector{property : value}

有4種選擇器：元素{}，#id{}，.class{}，[屬性]{}

其樣式：

background-color:

text-*:

font-*：

以及連結、列表、表格、輪廓，框模型（內邊距，外邊距等）等（http://www.w3school.com.cn/css/index.asp）詳細見文件。

另外很重要的CSS的定位：

position：reactive/absolute（相對定位、絕對定位）

float:（浮動）

另外一些很重要選擇器：父選擇器、子代選擇器、同胞選擇器等。

3.前端入門-JavaScript

是網路的一種指令碼語言。在我們驗證表單、檢驗瀏覽器、建立cookie時發揮了很大的作用。此處不詳細介紹，著重介紹JQuery。

4.前端入門-JQuery

是一個JavaScript庫，簡化了JavaScript程式設計，並實現更多更易學的功能。通過直接在script標籤中引入，可以下載到本地的一個庫中，或者從使用CDN庫中JQuery.js檔案。$表示JQuery物件。

例如：$(document).ready(function(){...})文件就緒時執行function中的內容。其選擇器與CSS中一致，例如（$("p")、$(".class")、$("#id")、$(" [href=' '] ")）。事件：例如$("button").click(function(){...})，給button一個click事件。不一一列舉：詳細（http://www.w3school.com.cn/jquery/index.asp）見文件。

另外：JQuery的效果，諸如：滑動，淡入淡出，隱藏顯示，動畫等可細細研究。

JQuery的HTML方法，比如獲取（text()，val()，html()，attr()...），新增，刪除等方法。

另外JQuery的遍歷（parent()，find()，sibling()...），父元素，子元素，同胞元素的方法。

（http://hemin.cn/jq/index.html）詳細JQuery使用手冊。

5.前端入門-Ajax

JSON：["data" : "data"]

 

以上。