JavaScript是一種基于對(duì)象和事件驅(qū)動(dòng)的幔戏、并具有安全性能的腳本語言
? ? JavaScript的特點(diǎn):
(1)、向HTML頁面中添加交互行為
(2)税课、腳本語言闲延,語法和Java類似
(3)痊剖、解釋型語言,邊執(zhí)行邊解釋
? ? JavaScript組成:
ECMAScript:類似于JS的API
DOM:頁面對(duì)象操作
BOM:瀏覽器對(duì)象操作
? ? JavaScript的基本結(jié)構(gòu):
<script type="text/javascript">
? ? <!—
JavaScript 語句;
? ? —>
</script >
? ? JavaScript的執(zhí)行原理:
????????????????1垒玲、瀏覽器接收用戶請(qǐng)求
? ? ???????? ????2陆馁、向服務(wù)器端請(qǐng)求某個(gè)包含JavaScript的頁面
? ? ???????????? 3、服務(wù)器端把包含JavaScript的HTML文件發(fā)送到瀏覽器客戶端合愈,瀏覽器逐條解析HTML標(biāo) 簽和JavaScript叮贩,并將效果呈現(xiàn)給用戶
***? 先解析HTML 再解析JavaScript
var? 用于聲明變量的關(guān)鍵字
var width;
width=5佛析;先聲明再賦值
var x,y,z=10; 同時(shí)聲明和賦值變量(可以同時(shí)聲明多個(gè)賦相同的值)
width =? 10益老;不聲明直接賦值
數(shù)據(jù)類型
undefined? 空值
null 空值
number 整數(shù)和浮點(diǎn)數(shù)
boolean true或false
string 用單引號(hào)或雙引號(hào)聲明的字符串
object JavaScript中的數(shù)組
typeof運(yùn)算符:
typeof檢測(cè)變量的返回值
typeof運(yùn)算符返回值如下
undefined:變量被聲明后,但未被賦值
string:用單引號(hào)或雙引號(hào)來聲明的字符串
boolean:true或false
number:整數(shù)或浮點(diǎn)數(shù)
object:javascript中的對(duì)象寸莫、數(shù)組和null
String對(duì)象
屬性:
var str="this is JavaScript";
var strLength=str.length; //長(zhǎng)度是18
方法:
字符串對(duì)象.方法名()
charAt(index) 返回在指定位置的字符
indexOf(str,index)? 查找某個(gè)指定的字符串在字符串中首次出現(xiàn)的位置
substring(index1,index2)? ? 返回位于指定索引index1和index2之間的字符串 捺萌,并且包括索引index1對(duì)應(yīng)的字符,不包括索引index2對(duì)應(yīng)的字符
split(str) 將字符串分割為字符串?dāng)?shù)組
數(shù)組
創(chuàng)建數(shù)組:var 數(shù)組名稱 = new Array(size);
賦值的方法一:
var fruits = new Array("apple","orange","peach");
方法二:
var fruits = new Array(3);
fruits[0] = "apple";
fruits[1] = "orange";
fruits[2] = "peach";
數(shù)組常用屬性和方法:
屬性:
length? 設(shè)置或返回?cái)?shù)組中元素的數(shù)目
方法:
join()? ? 把數(shù)組的所有元素放入一個(gè)字符串膘茎,通過分隔符進(jìn)行分隔
sort()? ? 對(duì)數(shù)組排序
push()? 向數(shù)組末尾添加一個(gè)或多個(gè)元素互婿,并返回新的長(zhǎng)度
運(yùn)算符號(hào):
算術(shù)運(yùn)算符:
+? -? *? /? %? ++? --
賦值運(yùn)算符:
=? +=? -=
比較運(yùn)算符:
>? <? >=? <=? ==? !=? ===? !==
邏輯運(yùn)算符:
&&? ||? !
? ? ? === 恒等于
? ? ? 類型和值都相等才相等
++和--
不賦值的情況下沒有任何區(qū)別? ?
邏輯控制語句
if條件語句
switch多分支語句
for辽狈、while循環(huán)語句
for-in
for(var 變量? in? 數(shù)組){? }
注釋
單行注釋://
多行注釋:/*....*/
常用系統(tǒng)函數(shù):
parseInt ("字符串")
將字符串轉(zhuǎn)換為整型數(shù)字
如: parseInt ("86")將字符串“86“轉(zhuǎn)換為整型值86
parseFloat("字符串")
將字符串轉(zhuǎn)換為浮點(diǎn)型數(shù)字
如: parseFloat("34.45")將字符串“34.45“轉(zhuǎn)換為浮點(diǎn)值34.45
用于檢查其參數(shù)是否是非數(shù)字
isNaN()
事件:
????onload 一個(gè)頁面或一副畫像完成加載
????onclick 鼠標(biāo)單擊某個(gè)對(duì)象
????onmouseover 鼠標(biāo)指針移到某元素上
????onkeydown 某個(gè)鍵盤按鍵被按下
????onchange 域的內(nèi)容被改變
BOM:瀏覽器對(duì)象模型(Browser Object Model)
BOM提供了獨(dú)立于內(nèi)容的慈参、可以與瀏覽器窗口進(jìn)行互動(dòng)的對(duì)象結(jié)構(gòu)
BOM可實(shí)現(xiàn)的功能:
彈出新的瀏覽器窗口
移動(dòng)、關(guān)閉瀏覽器窗口以及調(diào)整窗口的大小
頁面的前進(jìn)刮萌、后退
history 有關(guān)客戶訪問過的URL的信息
常用方法:
? ? ? back()? ? ? ? 加載history對(duì)象列表中的前一個(gè)URL
? ? ? forward()? ? 加載history對(duì)象列表中的下一個(gè)URL
? ? ? go()? ? ? ? ? ? 加載history對(duì)象列表中的前一個(gè)URL
location 有關(guān)當(dāng)前URL的信息
常用屬性:
? ? ? host 設(shè)置或返回主機(jī)名和當(dāng)前URL的端口號(hào)
? ? ? hostname 設(shè)置或返回當(dāng)前URL的主機(jī)名
? ? ? href 設(shè)置或返回完整的URL
常用方法:
? ? ? reload() 重新加載當(dāng)前文檔
? ? ? replace() 用新的文檔替換當(dāng)前文檔
window對(duì)象的常用方法
prompt() 顯示可提示用戶輸入的對(duì)話框
alert() 顯示帶有一個(gè)提示信息和一個(gè)確定按鈕的警示框
confirm() 顯示一個(gè)帶有提示信息驮配、確定和取消按鈕的對(duì)話框
close() 關(guān)閉瀏覽器窗口
open() 打開一個(gè)新的瀏覽器窗口,加載給定URL所指定的文檔
setTimeout() 在指定的毫秒數(shù)后調(diào)用函數(shù)或計(jì)算表達(dá)式
setInterval() 按照指定的周期(以毫秒計(jì))來調(diào)用函數(shù)或表達(dá)式
清除函數(shù):
clearTimeout()
clearInterval()
confirm()與alert ()着茸、 prompt()區(qū)別:
alert( ):一個(gè)參數(shù)壮锻,僅顯示警告對(duì)話框的消息,無返回值涮阔,不能對(duì)腳本產(chǎn)生任何改變
prompt( ):兩個(gè)參數(shù)猜绣,輸入對(duì)話框,用來提示用戶輸入一些信息敬特,單擊“取消”按鈕則返回null掰邢,單擊“確定”按鈕則返回用戶輸入的值,常用于收集用戶關(guān)于特定問題而反饋的信息
confirm( ):一個(gè)參數(shù)伟阔,確認(rèn)對(duì)話框辣之,顯示提示對(duì)話框的消息、“確定”按鈕和“取消”按鈕皱炉,單擊“確定”按鈕返回true怀估,單擊“取消”按鈕返回false,因此與if-else語句搭配使用
open() 方法:
window.open("彈出窗口的url","窗口名稱","窗口特征”);
窗口特征的屬性:
height多搀、width 窗口文檔顯示區(qū)的高度歧蕉、寬度。以像素計(jì)
left康铭、top 窗口的x坐標(biāo)廊谓、y坐標(biāo)。以像素計(jì)
Document對(duì)象
常用屬性:
referrer? ? 返回載入當(dāng)前文檔的URL
URL 返回當(dāng)前文檔的URL
常用方法:
getELementById() 返回對(duì)擁有指定id的第一個(gè)對(duì)象的引用
getElementByName() 返回帶有指定名稱的對(duì)象的集合
getElementByTagName() 返回帶有指定標(biāo)簽名的對(duì)象的集合
write() 向文檔寫文本麻削、HTML表達(dá)式或JavaScript代碼
Date對(duì)象:var 日期對(duì)象 = new Date()
常用方法:
getDate() 返回Date對(duì)象的一個(gè)月中的每一天蒸痹,范圍(1~31);
getDay() 返回Date對(duì)象的星期中的每一天呛哟,范圍(0~6)叠荠;
getHours() 返回Date對(duì)象的小時(shí)數(shù),范圍(0~23)扫责;
getMinutes() 返回Date對(duì)象的分鐘數(shù)榛鼎,范圍(0~59);
getSeconds() 返回Date對(duì)象的秒數(shù)鳖孤,范圍(0~59)者娱;
getMonth() 返回Date對(duì)象的月份,范圍(0~11)苏揣;
getFullYear() 返回Date對(duì)象的年份黄鳍,其值為4位數(shù)
getTime() 返回自某一時(shí)刻(1970年1月1日)以來的毫秒數(shù)
Math對(duì)象
ceil() 對(duì)數(shù)字進(jìn)行上舍入
floor() 對(duì)數(shù)字進(jìn)行下舍入
round() 四舍五入
random() 返回0~1之間的隨機(jī)數(shù)
DOM:文檔對(duì)象模型(Document Object Model)
節(jié)點(diǎn)屬性:
parentNode 返回節(jié)點(diǎn)的父節(jié)點(diǎn)
childNodes 返回子節(jié)點(diǎn)集合,childNodes[i]
firstChild 返回節(jié)點(diǎn)的第一個(gè)子節(jié)點(diǎn)平匈,最普遍的用法是訪問該元素的文本節(jié)點(diǎn)
lastChild 返回節(jié)點(diǎn)的最后一個(gè)子節(jié)點(diǎn)
nextSibling 下一個(gè)節(jié)點(diǎn)
previousSibling 上一個(gè)節(jié)點(diǎn)
element屬性:
firstElementChild 返回節(jié)點(diǎn)的第一個(gè)子節(jié)點(diǎn)框沟,最普遍的用法是訪問該元素的文本節(jié)點(diǎn)
lastElementChild 返回節(jié)點(diǎn)的最后一個(gè)子節(jié)點(diǎn)
nextElementSibling 下一個(gè)節(jié)點(diǎn)
previousElementSibling 上一個(gè)節(jié)點(diǎn)
style屬性:
onclick 當(dāng)用戶單擊某個(gè)對(duì)象時(shí)調(diào)用事件
onmouseover 鼠標(biāo)移到某元素之上
onmouseout 鼠標(biāo)從某元素移開
onmousedown 鼠標(biāo)按鈕被按下
操作節(jié)點(diǎn)屬性
getAttribute("屬性名")
setAttribute("屬性名","屬性值")
創(chuàng)建、插入和刪除節(jié)點(diǎn)
createElement( tagName) 創(chuàng)建一個(gè)標(biāo)簽名為tagName的新元素節(jié)點(diǎn)
A.appendChild( B) 把B節(jié)點(diǎn)追加至A節(jié)點(diǎn)的末尾
insertBefore( A,B ) 把A節(jié)點(diǎn)插入到B節(jié)點(diǎn)之前
cloneNode(deep) 復(fù)制某個(gè)指定的節(jié)點(diǎn)
removeChild( node) 刪除指定的節(jié)點(diǎn)
replaceChild( newNode, oldNode) 用其他的節(jié)點(diǎn)替換指定的節(jié)點(diǎn)
獲取元素的樣式:
兼容IE:document.getElementById("cartList").currentStyle.display
不兼容IE: document.defaultView.getComputedStyle(cartList,null).display