初探Javascript魅力(1)
轉自：CSDN--http://blog.csdn.net/cherry_vicent/article/details/42120149
1、javascript是什麽
根據用戶的一些操作，然後來修改頁面上的一些元素、屬性等。
（1）HTML+CSS靜態頁面，JS給頁面添加動的效果
（2）網頁特效的原理
javascript就是修改樣式
（3）編寫JS的流程：
【1】布局：HTML+CSS
【2】屬性：確定要修改哪些屬性
【3】事件：確定用戶做哪些操作
【4】編寫JS：在事件中，用JS來修改頁面元素的樣式
補：事件：就是用戶操作，如鼠標點擊、移入、移出等
（4）id：在css中，id作為css裏的一個選擇符存在，而在JS裏它有更加廣泛的用途，
在JS中扮演標簽(元素)名字的作用，如<div id="div1">......</div>，id在這個例子裏扮演了div名字的作用，div1就是div的名字
（5）div1.style.display=‘block‘
點 . ------> 的，一般來說是所屬的關系，其實是屬性
等號 = ------> 在數學裏，x=5，表示x的值就是5，即等號就是相等的意思
在JS裏，等號並不是相等的意思，等號指賦值，把什麽變成什麽，把=右邊的值賦給左邊
2、第一個JS兼容性問題:document.getElementById
（1）在FF和低版本的chrome下，是不能直接拿著id就用的，存在兼容問題
真正兼容的寫法是document.getElementById(‘id名字‘)，在任何瀏覽器下均可用
如：document.getElementById(‘div1‘);
通過div1這個id把元素獲取出來，然後再來用
註：記住，不能直接拿著id就用，而必須的通過getElementById（把元素獲取出來）獲取一下，然後才可以用
（2）網頁換膚
(1) 任何標簽都可以加ID，包括link
(2) 任何標簽的任何屬性，也都可以修改
(3) HTML裏怎麽寫，JS裏就怎麽寫，只有一個例外就是class，因為class在JS裏是關鍵字（保留字），所以不能直接拿來用，要寫成className
3、引入函數：因為直接在事件內寫代碼會很亂
（1）函數基本格式：
[javascript] view plain copy
- function 函數名()
- {
- 代碼
- }
JS裏的函數和css裏的class有點相似，像class它最大的一個功能就是你把這個樣式寫到class裏邊，然後只要需要這套樣式的地方，直接把那個class拿過去用就
可以了，同樣JS裏的函數也一樣.
（2）函數的定義和調用
[javascript] view plain copy
- function show() //定義
- {
- alert(‘abc‘);
- }
- show(); //調用
函數定義：只是告訴系統有這個函數，不會實際執行
函數調用：真正執行函數裏的代碼
註：函數的定義和調用缺一不可，只有定義則沒反應，只有調用則顯示出錯了
（3）引入變量的概念：考慮到重用
變量：就是給東西取了個別名
如var oDiv=document.getElementById(‘div1‘);給後面這大串取了個別名叫oDiv。看到oDiv就跟看到document.getElementById(‘div1‘)是一樣的效果
註：(1) 如果你要操作一個元素，你必須先把它選擇過來，比如現在要操作的是text這個元素，那麽需要先給它加個id，比如id="txt1",然後function函數裏用
getElementById把它給選擇過來
(2) 要操作誰，就要獲取誰
(3) 需要一個函數，這個函數是為按鈕準備的，因為它點擊需要一個函數
4、if判斷：如點擊按鈕顯示/隱藏div(彈出菜單)
（1）if判斷基本格式：
[javascript] view plain copy
- if(條件)
- {
- 語句1
- }
- else
- {
- 語句2
- }
翻譯：如果條件成立就執行語句1，如果條件不成立就執行語句2
註：(1) if ：如果
(2) 條件：在IS裏是判斷的意思，就是遇到不同的情況就做不同的操作，遇到不同的問題就做不同的處理
（2）單等和雙等(=和==)
= 賦值（改變，變成）
== 判斷（判斷兩邊是否相等）
（3）為a鏈接添加JS
<!--<a href="javascript:alert(‘a‘);">鏈接</a> -->
<a href="javascript:;">鏈接</a>
一般a裏不加JS代碼，而是空的js原因：(1) 在a裏加js代碼不好 (2) 加空的js代碼而不是加#，因為它不會像#那樣一點就跳到頁首。
初探Javascript魅力(1)