在JavaScript中，調用事件的方式共有2種：
下面詳細給大家介紹這2種JavaScript事件的調用方式。
在script標簽中調用事件，也就是在<script></script標簽內部調用事件。
語法：
var 變量名 = document.getElementById("元素id");//獲取某個元素，並賦值給某個變量
變量名.事件處理器 = function()
{
……
}
舉例：
在線測試
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<input id="btn" type="button" value="提交" />
<script type="text/javascript">
var e = document.getElementById("btn");
e.onclick = function () {
alert(" 學習網");
}
</script>
</body>
</html>
在浏覽器預覽效果如下：
分析：
當點擊了按鈕之後，JavaScript就會調用鼠標的點擊（onclick）事件，效果如下：
很多人覺得很奇怪，document.getElementById()獲取的是一個元素，能賦值給一個變量嗎？答案是可以的。那問題又來了，為什麼要使用document.getElementById()來獲取一個元素賦值給一個變量呢？用以下代碼不行麼？
<script type="text/javascript">
document.getElementById("btn").onclick = function{
alert(" 學習網");
}
</script>
其實上述代碼也是可行的，只不過呢，如果不使用document.getElementById()來獲取一個元素賦值給一個變量，以後我們如果要對該元素進行多次不同操作，豈不是每次都要寫document.getElementById()？這樣的話，代碼就會顯得很冗余。
在元素中調用事件，我們在“JavaScript在HTML的引用方式”這一節已經給大家介紹過了。
在元素事件中引入JS，就是指在元素的某一個屬性中直接編寫JavaScript程序或調用JavaScript函數，這個屬性指的是元素的“事件屬性”。
舉例1：（在元素事件屬性中直接編寫JavaScript）
在線測試
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<input type="button" onclick="alert(' 學習網')" value="按鈕"/>
<body>
</html>
在浏覽器預覽效果如下（點擊按鈕後的效果）：
舉例：
在線測試
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
function alertMessage()
{
alert(" 學習網");
}
</script>
</head>
<body>
<input type="button" onclick="alertMessage()" value="按鈕"/>
<body>
</html>
在浏覽器預覽效果（點擊按鈕後的效果）如下：
分析：
那麼這兩種方法有什麼本質的區別呢？其實，第2種方法不需要使用getElementById()等方法來獲取DOM，然後才調用函數或方法。因為它是直接在JavaScript元素中調用的。
這2種調用JavaScript事件的方式，大家剛剛開始看不理解沒關系，我們只是給大家說個語法，留個印象。在接下來的章節中，我們會經常接觸。