導航
Document是根節點
parentNode:擷取父節點
childNodes：擷取所有子節點
firstChild：第一個子節點
lastChild：擷取最後一個子節點
BOM
概念browser object model
常用對象
Window：視窗，浏覽器的視窗
我們定義的全局變量和全局函數都是window對象的屬性和方法
全局變量是window的屬性。
全局函數是window的方法：
Window.innerWidth
Window.innerHeight
常用的方法：
Open：打開一個新的視窗，要傳三個參數；第一個為将要打開的視窗路徑
第二個：打開的方式 ； 第三個為對于新打開浏覽器的描述（寬，高等等）
var myWindow=window.open("https://www.baidu.com/","_blank","width=200,height=300");
//close：關閉一個視窗
myWindow.close();
//moveTo：移動一個視窗，以視窗的左上角為坐标起點
myWindow.moveTo(200,200);
//focus：使視窗獲得焦點
myWindow.focus();
//resizeto：改變視窗的大小
myWindow.resizeTo(1000,1500);
screen:螢幕 也是window下面的一個對象，在使用的時候可以用window.screen
也可以省略window
螢幕的常用屬性：寬，高；可用寬與可用高（可用高不包括工作列）
**Location：**位址
**常用屬性：**href完整路徑 port端口号 pathname路徑名
Protocol：協定
常用方法
打開一個新的路徑（）視窗
LOCATION.ASSIGN(“HTTP://WWW.BAIDU.COM/”);
重新整理：普通重新整理和強制重新整理
如果傳值為TRUE，那麼就是強制重新整理
History：曆史記錄
記錄目前視窗的曆史，可以進行頁面的轉換
方法：back—回到上一頁
Forward—進入下一頁
Go—進入确定的那一頁（-1回到上一頁）
History.back()
History.forward()
History.go(-1)
彈窗
Alert（）：警告提示框，也是window下的方法(window.alert())，window可以省略不寫
Prompt（“請輸入内容”，“預設值”）資訊提示輸入框，也是window下的方法，window也可以省略不寫，當我們點選确定時，才會把值傳回，否則為空
Confirm（“提示的資訊”）确認框，也是window下的方法，window也可以省略不寫
當點選确定的時候，傳回true，如果點取消，傳回false
cookie
Cookie的作用：在本地浏覽器儲存資料，經常用于記住賬号等等
**Cookie組成：**鍵值對的形式
Username=asdasd pwd=123456 phone=13512633908
有效期：expires=今天以後的時間
存儲cookie
按照cookie的形式寫好一個字元串，然後把它指派給document.cookie，浏覽器就會緩存這個cookie，可以存儲多個鍵值對，但是鍵的名字不能重複
導航
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div name="第一章">
<p id="p1">第一段<span>第一句</span><span>第二句</span></p>
</div>
<input type="button" value="擷取p1父節點的name屬性" onclick="fun1()">
<input type="button" value="擷取p1子節點的個數" onclick="fun2()">
<input type="button" value="獲第一個取p1子節點的節點類型" onclick="fun3()">
<input type="button" value="擷取p1最後一個子節點的節點類型" onclick="fun4()">
</body>
<script type="text/javascript">
var p1=document.getElementById("p1");
function fun1(){
var value=p1.parentNode.getAttribute("name");
window.alert(value);
}
function fun2(){
var childs=p1.childNodes;
alert(childs,length);
}
function fun3(){
alert(p1.firstChild.nodeType)
}
function fun4(){
window.alert(p1.lastChild.nodeType);
}
</script>
</html>
window
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<input type="button" onclick="fun()" value="請點選">
<script type="text/javascript">
// var a=1;
// function test(){
// var a=2;
// alert(a);//2
// alert(window.a);//1
// }
// test();
function fun(){
var myWindow=window.open("https://wwww.baidu.com/","_blank","width=200,height");
//myWindow=close();
//以一個視窗的左上角為移動視窗的坐标
myWindow.moveTo(200,200);
//視窗獲得焦點
myWindow.focus();
//改變視窗大小
myWindow.resizeTo(1000,1500);
}
</script>
</body>
</html>
location
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<input type="button" value="點選" onclick="fun()" />
</body>
<script type="text/javascript">
function fun(){
location.assign("https://wwww.baidu.com/");
}
</script>
</html>
重新整理
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<input type="button" value="重新整理" onclick="fun1()" />
</body>
<script type="text/javascript">
function fun1(){
location.reload();
}
</script>
</html>
彈窗
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
<script type="text/javascript">
// alert("提示的内容");
// var str=prompt("請輸入内容","Hello world");//請輸入内容就是提示的内容
var isRight=confirm("是否确定删除");
document.write(typeof(isRight)+"\n"+isRight);
</script>
</html>
cookie
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
<script type="text/javascript">
var d=new Date();
d.setTime(d.getTime()-(24*60*60*1000*3650*10));
expires="expires="+d.toGMTString();
document.cookie="username=";expires;
document.cookie="passwd=7355608";
document.cookie="passwgjhgfd=7355szdfsf608";
</script>
</html>
本地使用js或jquery操作cookie在谷歌浏覽器chrome中不生效
新手學習js或jquery時，一般是在本地調試（前端學習一般用不到伺服器端），當學習到cookie一節時，在谷歌浏覽器chrome中調試居然不生效！！！不管是使用jquery的cookie插件，還是js原生态的cookie方法都不生效！！！
什麼原因呢？
原因在于chrome不支援js在本地操作cookie!
據測試，除了chrome浏覽器外，其他主流浏覽器（ie、firefox等）都支援js在本地操作cookie。當然部署到伺服器上所有浏覽器都是支援的。
當然，還有另外一個原因：浏覽器設定成不支援cookie。這樣，調試js操作cookie當然也是不生效的。
那麼，怎麼知道目前浏覽器不支援或Cookie已被禁用呢？可以使用以下js代碼：
var dt = new Date();
dt.setSeconds(dt.getSeconds() + 60);
document.cookie = "cookietest=1; expires=" + dt.toGMTString();
var cookiesEnabled = document.cookie.indexOf("cookietest=") != -1;
if(!cookiesEnabled) {
//沒有啟用cookie
alert("沒有啟用cookie ");
} else{
//已經啟用cookie
alert("已經啟用cookie ");
}