JavaScript 三種不同位置代碼的寫法
更新時(shí)間：2009年10月25日 20:23:00 作者：
客戶端腳本JavaScript在寫法上其實(shí)有很多種方法，它們的放置位置也非常之多。
下面列舉在三種不同的地方寫JavaScript代碼，實(shí)現(xiàn)的效果都是點(diǎn)擊按鈕button彈出alert警告框
第一種是最常見(jiàn)的，代碼如下
html代碼
<input type="button" value="按鈕1" id="btn1" onclick="pop()">
js代碼
function pop()
{
alert("在JavaScript函數(shù)處調(diào)用");
}
第二種是最簡(jiǎn)單的實(shí)現(xiàn)方式，代碼如下
<input type="button" value="按鈕2" id="btn2" onclick="javascript:alert('直接寫函數(shù)');">
第三種方式相對(duì)復(fù)雜，代碼如下
html代碼
<input type="button" value="按鈕3" id="btn3">
js代碼
var obj=document.getElementById("btn3");//以下語(yǔ)句一定要放在定義btn3的下面，否則編譯器是不能識(shí)別btn3的。
if(window.addEventListener)// Mozilla, Netscape, Firefox等瀏覽器
{
obj.addEventListener("click",fun,false);//注意這里的false
}
else //IE瀏覽器
{
obj.attachEvent("onclick",fun);
}
function fun()
{
alert("通過(guò)在函數(shù)中觸發(fā)事件");
}
總結(jié)：三種寫法方式實(shí)現(xiàn)的效果是完全一樣的，應(yīng)該說(shuō)三種方式都是常用的，而且各有優(yōu)缺點(diǎn)。。。。
第一種是最常見(jiàn)的，代碼如下
html代碼
<input type="button" value="按鈕1" id="btn1" onclick="pop()">
js代碼
function pop()
{
alert("在JavaScript函數(shù)處調(diào)用");
}
第二種是最簡(jiǎn)單的實(shí)現(xiàn)方式，代碼如下
<input type="button" value="按鈕2" id="btn2" onclick="javascript:alert('直接寫函數(shù)');">
第三種方式相對(duì)復(fù)雜，代碼如下
html代碼
<input type="button" value="按鈕3" id="btn3">
js代碼
var obj=document.getElementById("btn3");//以下語(yǔ)句一定要放在定義btn3的下面，否則編譯器是不能識(shí)別btn3的。
if(window.addEventListener)// Mozilla, Netscape, Firefox等瀏覽器
{
obj.addEventListener("click",fun,false);//注意這里的false
}
else //IE瀏覽器
{
obj.attachEvent("onclick",fun);
}
function fun()
{
alert("通過(guò)在函數(shù)中觸發(fā)事件");
}
總結(jié)：三種寫法方式實(shí)現(xiàn)的效果是完全一樣的，應(yīng)該說(shuō)三種方式都是常用的，而且各有優(yōu)缺點(diǎn)。。。。
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了js仿QQ郵箱收件人選擇與搜索功能，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-02-02
JS,Jquery獲取select,dropdownlist,checkbox下拉列表框的值(示例代碼)
本篇文章主要是對(duì)JS,Jquery獲取select,dropdownlist,checkbox下拉列表框的值(示例代碼)進(jìn)行了介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助2014-01-01
微信小程序?qū)崿F(xiàn)3D輪播圖效果（非swiper組件）
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)3D輪播圖效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-09-09
JS無(wú)限樹(shù)狀列表實(shí)現(xiàn)代碼
本人水平有限，這么個(gè)東東想了好幾天才弄出來(lái)個(gè)半成品，還有一些問(wèn)題沒(méi)有解決，先放上來(lái)存著備忘，也望高手指點(diǎn)一二。2011-01-01
JavaScript實(shí)現(xiàn)找質(zhì)數(shù)代碼分享
這篇文章主要介紹了JavaScript實(shí)現(xiàn)找質(zhì)數(shù)代碼分享,本文直接給出實(shí)現(xiàn)代碼,需要的朋友可以參考下2015-03-03
用JavaScript隱藏控件的方法有兩種，分別是通過(guò)設(shè)置控件的style的“display”和“visibility”屬性，下面詳細(xì)為大家介紹下具體的使用2013-12-12
.ts是一種高清視頻封裝格式文件，全稱為MPEG2-TS，TS表示TransportStream，這篇文章主要介紹了TS如何從目錄中提取所有指定擴(kuò)展名的文件,需要的朋友可以參考下2023-05-05
設(shè)置checkbox為只讀(readOnly)的兩種方式
設(shè)置checkbox為只讀的方法有很多，在本文為大家詳細(xì)介紹下兩種比較實(shí)用的方法，感興趣的朋友不要錯(cuò)過(guò)2013-10-10
JS基于遞歸實(shí)現(xiàn)網(wǎng)頁(yè)版計(jì)算器的方法分析
這篇文章主要介紹了JS基于遞歸實(shí)現(xiàn)網(wǎng)頁(yè)版計(jì)算器的方法,結(jié)合實(shí)例形式分析了javascript采用遞歸算法實(shí)現(xiàn)網(wǎng)頁(yè)版計(jì)算器的步驟與相關(guān)操作技巧,需要的朋友可以參考下2017-12-12
這篇文章主要為大家詳細(xì)介紹了微信小程序表單驗(yàn)證錯(cuò)誤提示效果，點(diǎn)擊確認(rèn)發(fā)布不能為空錯(cuò)誤提示，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-05-05