回顧選擇器
基礎(chǔ)選擇器
? 1.元素選擇器
? 元素名(標簽名)
? ? 如：
? ? h1
? ? div
? ? a
? ? span
? ? input
? ? form
? ? option
? ? select
? 2.id選擇器
? 在html里面? 使用id=“cc”
? 使用#來查找 id選擇器
? ? 如：#cc
? 3.類選擇器
? 在HTML里面使用class設(shè)置
? ? 在CSS和JS里面 查找 使用.類選擇器的名字
? ? 如：.haha
? 如：<div class = "haha"></div>
后代選擇器
? 只要是 某個元素中的 子元素? 都可以選擇上
? 后代選擇器是通過空格隔開的? ? 如：.xx .title{}、div a{}、#ff .vv{}
? 兩個選擇器之間是有空格的
子類選擇器
? 只能選擇直接子元素
? 父元素的選擇器>子元素的選擇器
? ? 如：
? ? .item>p
交集選擇器
? div.top
? 都包含
? p.top
并集選擇器
? html,body
? .top,.nav
屬性選擇器
? input[type=password]
? 選擇器名[屬性名=屬性值]
子類第幾個元素
? ：first-child
? ：nth-child
注意分清交集和后代
1.查詢DOM元素
1.document.querySelector("選擇器")
? 查找到的是第一個元素
2.document.querySelectorAll("選擇器")
? 偽數(shù)組
3.id選擇器 document.getElementById("不需要加#");
4.通過類選擇器查找document.getElementByClassName("div");
? 偽數(shù)組
5.通過元素名查找document.getElementByTagName("div");
? 偽數(shù)組
2.創(chuàng)建DOM元素
document.createElement("標簽的名字")
步驟
1.創(chuàng)建dom元素
var 變量名= document.createElement("標簽的名字")；
2.放內(nèi)容
dom.innerText = "wenben"
放文本
dom.innerHTML = "<div>< img src="" ></div>"
放HTML里的字符串
dom.src="";
dom.appendChild(子元素)；
dom 不一定是父元素
3.放到父元素中
父元素.appendChild(dom);
<ul class="nav"></ul>
<script>
//在nav里面? 創(chuàng)建一個li? 里面放入? 首頁? 文字
? ? var nav = document.querySelector(".nav");
? ? var li = document.createElement("li");
? ? li.innerText = "首頁";
? ? nav.appendChild(li);
</script>
<ul class="goods"></ul>
//商品goods
? ? var goods =document.querySelector(".goods");
? ? var goodsItem = document.createElement("li");
? ? goods.appendChild(goodsItem);
創(chuàng)建日期對象
獲取當前日期
var date = new Date();
new 通過類名 創(chuàng)建對象的關(guān)鍵字
Date 日期類
通過日期類? -> 創(chuàng)建一個當前的日期對象
日期
年
月
得加1
日
周
大寫的M
時
分
小寫的M
秒
毫秒
獲取將來 過去的時間（指定時間）
new Date(1288336112000)
var date = new Date();
date.setTime(1288336112000);
時間戳
1970年-某個時間的? 毫秒數(shù)
時間戳 轉(zhuǎn) 日期對象
new Date(1288336112000)
var date = new Date();
date.setTime(1288336112000);
日期對象 轉(zhuǎn) 時間戳
var date = new Date();
date.getTime();
1.窗口對象
window窗口包含的部分
瀏覽器可視的范圍
1.導(dǎo)航
2.歷史記錄
3.屏幕大小
4.位置
窗口對象? 是Window的實例對象
注意：
1.定義的全局變量
是定義到window對象上面的
可以通過window.xx訪問
2.在最外面定義的函數(shù)
是定義到了window對象上面
可以通過window.xx訪問
this 就表示-> window對象
尺寸
window.innerHeight - 瀏覽器窗口的內(nèi)部高度(包括滾動條)
window.innerWidth - 瀏覽器窗口的內(nèi)部寬度(包括滾動條)
如果IE 5、6、7、8
document.documentElement.clientHeight
document.documentElement.clientWidth
事件
resize
屏幕尺寸發(fā)生改變的時候調(diào)用
load
等窗口里的資源? 加載完成的時候調(diào)用
