當(dāng)前位置：
首頁(yè) >
前端技术
> javascript
>内容正文
javascript
大数据WEB阶段（四）JavaScript
生活随笔
收集整理的這篇文章主要介紹了
大数据WEB阶段（四）JavaScript
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
JavaScript
一、JavaScript概述
二、在html中引入js代碼
直接在html中編寫(xiě)js代碼
一般推薦把js代碼寫(xiě)到head中 。
<html><head><title>標(biāo)題</title><script type="text/javascript">//js代碼</script></head> </html>引入外部文件
注意：如果是用script引入外部js文件 ， 則在script便簽內(nèi)部你不要寫(xiě)js代碼 ， 并且標(biāo)簽不要寫(xiě)成自閉 形式 ， 否則 可能會(huì)導(dǎo)致引入失敗的問(wèn)題 。
<script type="text/javascript" src="demo.js"></script>三、js語(yǔ)法
注釋
1. 單行注釋： //注釋 內(nèi)容 2. 多行注釋： /*注釋內(nèi)容*/運(yùn)算符
js中與java運(yùn)算負(fù)的 不同之處：
typeof：
用類(lèi)返回變量\常量\表達(dá)式的數(shù)據(jù)類(lèi)型
var x = 123 ; typeof x;delete : 用類(lèi)刪除數(shù)組中的元素或者刪除對(duì)象中的屬性或方法
var arr = [123,"sd",true]; delete arr[1];函數(shù)
用function關(guān)鍵字來(lái) 定義 一個(gè)函數(shù)
function 函數(shù)名（參數(shù)列表）{//函數(shù)體 }用函數(shù)表達(dá)式來(lái)定義一個(gè)函數(shù)
var 函數(shù)名 = function（參數(shù)列表）{//函數(shù)體 }數(shù)組
通過(guò)Array()構(gòu)造函數(shù)來(lái)創(chuàng)建數(shù)組
var arr1 = new Array();//創(chuàng)建一個(gè)空數(shù)組 var arr2 = new Array(10);//創(chuàng)建一個(gè)初始容量為10的數(shù)組 var arr3 = new Array(11,"ddef",true);//創(chuàng)建一個(gè)具有指定初始值的數(shù)組通過(guò) 數(shù)組直接量來(lái)創(chuàng)建數(shù)組
var arr1 = [];//創(chuàng)建一個(gè)空數(shù)組 var arr2 = [22,"df",,true];//創(chuàng)建一個(gè)具有指定初始值的數(shù)組js內(nèi)置對(duì)象
String對(duì)象
創(chuàng)建
var str1 = new String("df"); var str2 = "sd";RegExp對(duì)象（正則表達(dá)式）
創(chuàng)建：
var reg1 = new RegExp("xxxx"); var reg2 = /xxxx/;Array對(duì)象
創(chuàng)建：
var arr1 = new Array(); var arr2 = [];date對(duì)象
創(chuàng)建：
var date1 = new Date();//當(dāng)前時(shí)間 var date2 = new Date(年， 月 ， 日，[時(shí)， 分 ， 秒]);//指定時(shí)間 ， 可以只有 年月日 注意： 指定時(shí)間時(shí) 月份是從0開(kāi)始的常用方法
data.toLocaleString() 把日期(一個(gè)數(shù)值)轉(zhuǎn)變成本地日期格式字符串
例如：var date2 = new Date(2008,7,8); date2.toLocaleString(); // "2008/8/8 上午12:00:00"data.getFullYear() 獲取日期對(duì)象中所表示時(shí)間的年份
全局對(duì)象
parseFloat(numString) 將字符串轉(zhuǎn)換成浮點(diǎn)數(shù)。
例如：parseFloat("13.14") // 返回number類(lèi)型的13.14parseInt(numString) 將字符串轉(zhuǎn)成整數(shù)，非四舍五入。
例如：parseInt("9.99") // 返回number類(lèi)型的9isNaN(numValue) 判斷一個(gè)值是否為非數(shù)字。
例如： isNaN("abc") // true isNaN("123") // falseeval(codeString) 判斷一個(gè)字符串并將其以腳本代碼的形式執(zhí)行
例如：eval("alert(1+2)"); //會(huì)直接將"alert(1+2)"當(dāng)作代碼執(zhí)行，彈出3自定義對(duì)象
方式一 ：構(gòu)造函數(shù)定義對(duì)象
function Person(){} // 定義一個(gè)空的Person對(duì)象function Person2(參數(shù)1,參數(shù)2...){對(duì)象內(nèi)容... } //定義一個(gè)帶參數(shù)的對(duì)象方式二：對(duì)象直接量
var p3 = {"key1" : "value1","key2" : "value2"......... }對(duì)象中取值：
P3.key1 或者 p3["key1"]案例：
四、DHTML
BOM
案例：
<!-- BOM --><script type="text/javascript">//window對(duì)象//1.在按鈕點(diǎn)擊時(shí)彈出提示框function clickfn(){alert("按鈕被點(diǎn)擊");}//2.輸入框1獲得焦點(diǎn)時(shí)彈出提示框function focusfn(){alert("輸入框1獲得焦點(diǎn) ");}//3.輸入框2失去焦點(diǎn)時(shí)彈出提示框function blurfn (){alert("輸入框2失去焦點(diǎn)");}//4.彈出輸入框3中的value值onload=function(){//獲取輸入框3的input按鈕var inp = document.getElementById("input3");alert(inp.value);}//5.點(diǎn)擊刪除商品按鈕，彈出提示是否刪除,如果確定，則彈出商品已刪除，否則彈出商品還在function delfn(){if(confirm("確認(rèn)刪除商品？")){alert("商品已刪除");}else{alert("商品還在");}}//location對(duì)象//1.彈出當(dāng)前urlalert(location.href);//2.將頁(yè)面url設(shè)置為"http://www.baidu.com"alert("此頁(yè)面將跳轉(zhuǎn)到tmooc");location.href = "http://www.baidu.com";</script>DOM
案例1：
/* --通過(guò)ID獲取并彈出用戶(hù)名輸入框的值-- */function demo1(){//根據(jù)ID獲取用戶(hù)名輸入框，un即代表整個(gè)輸入框var un = document.getElementById("username");alert(un.value);//可以自己設(shè)置value值un.value = "蘭姐";}/* --通過(guò)name屬性獲取并彈出密碼輸入框的值-- */function demo2(){//根據(jù)name屬性獲取密碼輸入框，因?yàn)閚ame屬性可以重復(fù)，所以獲取的是一個(gè)集合數(shù)組var pwarr = document.getElementsByName("password");//在數(shù)組中獲取第一個(gè)元素var pw = pwarr[0];alert(pw.value);}/* --通過(guò)元素名稱(chēng)獲取并彈出確認(rèn)密碼輸入框的值-- */function demo3(){//根據(jù)標(biāo)簽名獲取確認(rèn)密碼輸入框，同樣，獲取的是一個(gè)數(shù)組var inparr = document.getElementsByTagName("input");//獲取第三個(gè)元素var pw2 = inparr[2];alert(pw2.value);} /* --獲取元素內(nèi)容-- */function demo4(){var oP = document.getElementById("pid");//獲取p標(biāo)簽中的文本內(nèi)容 innerText(部分瀏覽器不支持)alert(oP.innerText);//獲取p標(biāo)簽中的所有html內(nèi)容 innerHTML(絕大部分瀏覽器都支持)alert(oP.innerHTML);//設(shè)置p標(biāo)簽中的html內(nèi)容oP.innerHTML = "<font color='blue'>我要變身了...!</font>";}案例2：
/* --添加節(jié)點(diǎn): 添加一個(gè)div元素到body的最后面-- */function addNode(){//獲取父元素 //var oBody = document.getElementsByTagName("body")[0];//body是document的子對(duì)象，所以可以直接獲取var oBody = document.body;//創(chuàng)建一個(gè)游離div元素var oNewDiv = document.createElement("div");//給div中添加內(nèi)容oNewDiv.innerHTML = "我是新來(lái)的....!";//將div元素掛載到父元素上oBody.appendChild(oNewDiv);}/* --刪除節(jié)點(diǎn): 刪除body中id值為 div_3 的div元素-- */function deleteNode(){//獲取父元素bodyvar oBody = document.body;//獲取要?jiǎng)h除的元素div_3var oDiv_3 = document.getElementById("div_3");//解除父子關(guān)系oBody.removeChild(oDiv_3);}/* --更新節(jié)點(diǎn): 用新節(jié)點(diǎn)替換id值為 div_2 的div元素 -- */function updateNode(){//創(chuàng)建一個(gè)新節(jié)點(diǎn)var oNewDiv = document.createElement("div");oNewDiv.innerHTML = "我是來(lái)替換的~!";//獲取被替換的元素var oDiv_2 = document.getElementById("div_2");//獲取父元素, 并通過(guò)父元素替換子元素var oBody = oDiv_2.parentNode;oBody.replaceChild(oNewDiv, oDiv_2);}/* --克隆節(jié)點(diǎn)、插入節(jié)點(diǎn)到指定元素的前面--*/function copyNode(){//獲取指定元素var oDiv_4 = document.getElementById("div_4");//克隆元素var oCloneDiv = oDiv_4.cloneNode(true);//false 默認(rèn)值, 只克隆元素本身, 不克隆元素內(nèi)容//獲取父元素bodyvar oBody = document.body;var oDiv_2 = document.getElementById("div_2");//將克隆元素插入到指定位置oBody.insertBefore(oCloneDiv,oDiv_2);}總結(jié)
以上是生活随笔為你收集整理的大数据WEB阶段（四）JavaScript的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： 大数据WEB阶段（三）CSS
- 下一篇： 大数据WEB阶段（十三）JSP（一）JS