BOM
BOM（Browser Object Model）即瀏覽器對象模型。
BOM提供了獨(dú)立于內(nèi)容 而與瀏覽器窗口進(jìn)行交互的對象；
由于BOM主要用于管理窗口與窗口之間的通訊，因此其核心對象是window；-
瀏覽器的內(nèi)核
IE: trident內(nèi)核 (IE瀏覽器)
Firefox：gecko內(nèi)核 (火狐瀏覽器)
Safari:webkit內(nèi)核 (蘋果瀏覽器)
Opera:Blink內(nèi)核 （歐朋瀏覽器）
Chrome:webkit （谷歌瀏覽器）
DOM
image
DOM1也是存在，只是沒有涉及到事件，DOM3比DOM2多了鍵盤和鼠標(biāo)一些事件
DOM的事件模型： 捕獲----> 冒泡
DOM的事件流（三個階段）：捕獲階段---->目標(biāo)階段 -----> 冒泡階段
DOM事件捕獲的具體流程：
window---document---html---body---.... ---目標(biāo)元素
DOM事件的Event對象的常見應(yīng)用：
event.preventDefault() : 阻止默認(rèn)事件
event.stopPropagation(): 阻止冒泡
event.stopImmediatePropagation(): 除了該事件的冒泡行為被阻止之外(event.stopPropagation方法的作用),該元素綁定的后序相同類型事件的監(jiān)聽函數(shù)的執(zhí)行也將被阻止.
event.target: 返回觸發(fā)事件的元素
event.currentTarget: 返回綁定事件的元素
DOM的自定義事件：
var eve = new Event('eventName')
dom.addEventListener('eventName',function(){
}) //注冊事件
dom.dispatchEvent(eve); // 觸發(fā)事件，
---------------------------------------------------------
這個事件不能添加參數(shù)，想要添加參數(shù)，得自定義 CustomEvent事件
// 添加一個適當(dāng)?shù)氖录O(jiān)聽器
obj.addEventListener("cat", function(e) { process(e.detail) })
// 創(chuàng)建并分發(fā)事件
var event = new CustomEvent("cat", {"detail":{"hazcheeseburger":true}})
obj.dispatchEvent(event)
--
--
--
<body>
<button>派發(fā)事件</button>
<input type="text">
<script>
// 事件對象
var eve = new Event('gc')
// 注冊事件
document.querySelector("button").addEventListener('click',function(){
// this.dispatchEvent(eve)
document.querySelector("input").dispatchEvent(eve)
})
document.querySelector('input').addEventListener('gc',()=>{
console.log('xxxxxxxxx')
document.querySelector('input').value = "xxxxx"
})
// 觸發(fā)事件
</script>
</body>
