在JS中事件是JS與浏覽器交互的主要途徑。事件是一種叫做觀察者的設計模式，這是一種創建松散耦合代碼的技術。對象可以發布事件，用來表示在該對象生命周期中某個有趣的時刻到了。然後其他對象可以觀察該對象，等待這些有趣的時刻到來並通過運行代碼來響應。
觀察者模式有兩類對象組成：主題和觀察者。主體負責發布事件，同時觀察者通過訂閱這些事件來觀察該主體。該模式的一個關鍵概念是主體並不知道觀察者的任何事情，也就是說它可以獨自存在並正常運作即使觀察者不存在。從另一方面說，觀察者知道主體並能注冊事件的回調函數（事件處理程序）。涉及DOM上時，DOM元素便是主體，你的事件處理代碼便是觀察者。
事件是與DOM交互的最常見的方式，但它們也可以用於非DOM代碼中----通過實現自定義事件。自定義事件背後的概念是創建一個管理事件的對象，讓其他對象監聽那些事件。說簡單點就是我們希望在程序運行的時候，路線可能會有很多，如果程序運行到了一個特殊的地方，我們希望立刻運行用戶注冊的方法裡面的代碼，運行完畢後再繼續運行，這個過程叫做監聽。
例如，創建一個文件MyEvent.js文件，裡面創建一個類：
復制代碼 代碼如下:
function MyEvent(){
this.handler;
}
MyEvent.prototype={
addHandler:function(handler)
{
this.handler=handler;
},
fire:function()
{
this.handler();
},
removeHandler:function()
{
this.handler=null;
}
}
上面使用js原型的思想創建的一個類，如果讀者不太了解可以查看相關資料。MyEvent類型有一個單獨的屬性handler，用於存儲事件處理程序（也就是用戶注冊的方法）。還有三個方法：addHandler()，用於注冊事件處理程序；fire()，用於觸發一個事件；以及removeHandler()，用於注銷事件的處理程序。
然後我們可以這樣使用，新建一個html文件，放於和MyEvent.js同一個目錄，方便引用。代碼如下：
復制代碼 代碼如下:
<html>
<head>
<title></title>
<script type="text/javascript" src="MyEvent.js"></script>
<script type="text/javascript">
function init()
{
//初始化一個事件對象
var myEvent=new MyEvent();
//注冊方法
myEvent.addHandler(myMethod);
//運行到此處時觸發事件
myEvent.fire();
//移除事件注冊的方法
myEvent.removeHandler();
//再次觸發事件，發現無效
myEvent.fire();
}
function myMethod()
{
alert("成功");
}
</script>
</head>
<body>
<input type="button" onclick="init()" value="測試" />
</body>
</html>
上述的注釋已經很詳細的說明了其中的一種使用方式。這就是一個最簡單的自定義事件，不過還有很多缺陷，如何優化將在（二）裡面進行講解。