實(shí)例說明為什么不要行內(nèi)使用javascript
更新時(shí)間:2014年04月18日 11:33:35 作者:
不要行內(nèi)寫js是因?yàn)檫@樣很不安全,因?yàn)橛没鸷膄irebug可以輕松讓代碼失效,下面告訴大家為什么
很多人都曾經(jīng)這么使用Javascript
<a href="#" onclick="al()">保存</a>
上面的代碼,很方便使用,所有瀏覽器都支持
雖然我很早就看過一些書,說html,css,js分開來,比較容易維護(hù),但是我貪圖方面,還是經(jīng)常這么寫,不過我今天用火狐調(diào)試的時(shí)候發(fā)現(xiàn),還是不要行內(nèi)寫了,因?yàn)檫@樣很不安全,因?yàn)橛没鸷膄irebug可以輕松讓代碼失效!
下面看一下為什么:
<html>
<head>
<script>
function al()
{
alert("good");
}
</script>
</head>
<body>
<a href="#" onclick="al()">保存</a>
</body>
</html>
上面的代碼是點(diǎn)擊標(biāo)簽彈出對(duì)話框
效果如圖:
但是如果我在火狐里面找到a標(biāo)簽并把里面的js代碼去掉的話,在單擊a標(biāo)簽就不會(huì)彈出對(duì)話框了,如下圖
所以假如你這個(gè)單擊事件是判斷用戶輸入數(shù)據(jù)是否合法的話,那么就無法判斷了
本人是做asp.net的,今天就發(fā)現(xiàn)這個(gè)問題,因?yàn)閍sp.net服務(wù)器控件,有兩個(gè)單擊事件,一個(gè)前臺(tái)一個(gè)后臺(tái)的,我用前臺(tái)的單擊事件判斷用戶的輸入數(shù)據(jù),合法的話調(diào)用后臺(tái)事件,結(jié)果用火狐調(diào)試,就發(fā)現(xiàn)了上面介紹的現(xiàn)象,即使數(shù)據(jù)不合法也直接調(diào)用后臺(tái)方法了,也許我這個(gè)不是什么技術(shù),不過我為自己發(fā)現(xiàn)這個(gè)問題而高興,特此發(fā)文章分享一下,哈哈
解決方法:
給a標(biāo)簽個(gè)id ,如下面就可以了
<a id="a1" href="#">保存</a>
<script>
document.getElementById("a1").onclick=function(){}
</script>
復(fù)制代碼 代碼如下:
<a href="#" onclick="al()">保存</a>
上面的代碼,很方便使用,所有瀏覽器都支持
雖然我很早就看過一些書,說html,css,js分開來,比較容易維護(hù),但是我貪圖方面,還是經(jīng)常這么寫,不過我今天用火狐調(diào)試的時(shí)候發(fā)現(xiàn),還是不要行內(nèi)寫了,因?yàn)檫@樣很不安全,因?yàn)橛没鸷膄irebug可以輕松讓代碼失效!
下面看一下為什么:
復(fù)制代碼 代碼如下:
<html>
<head>
<script>
function al()
{
alert("good");
}
</script>
</head>
<body>
<a href="#" onclick="al()">保存</a>
</body>
</html>
上面的代碼是點(diǎn)擊標(biāo)簽彈出對(duì)話框
效果如圖:
但是如果我在火狐里面找到a標(biāo)簽并把里面的js代碼去掉的話,在單擊a標(biāo)簽就不會(huì)彈出對(duì)話框了,如下圖
所以假如你這個(gè)單擊事件是判斷用戶輸入數(shù)據(jù)是否合法的話,那么就無法判斷了
本人是做asp.net的,今天就發(fā)現(xiàn)這個(gè)問題,因?yàn)閍sp.net服務(wù)器控件,有兩個(gè)單擊事件,一個(gè)前臺(tái)一個(gè)后臺(tái)的,我用前臺(tái)的單擊事件判斷用戶的輸入數(shù)據(jù),合法的話調(diào)用后臺(tái)事件,結(jié)果用火狐調(diào)試,就發(fā)現(xiàn)了上面介紹的現(xiàn)象,即使數(shù)據(jù)不合法也直接調(diào)用后臺(tái)方法了,也許我這個(gè)不是什么技術(shù),不過我為自己發(fā)現(xiàn)這個(gè)問題而高興,特此發(fā)文章分享一下,哈哈
解決方法:
給a標(biāo)簽個(gè)id ,如下面就可以了
復(fù)制代碼 代碼如下:
<a id="a1" href="#">保存</a>
<script>
document.getElementById("a1").onclick=function(){}
</script>
相關(guān)文章
curring的概念將函數(shù)式編程的概念和默認(rèn)參數(shù)以及可變參數(shù)結(jié)合在一起.一個(gè)帶n個(gè)參數(shù),curried的函數(shù)固化第一個(gè)參數(shù)為固定參數(shù),并返回另一個(gè)帶n-1個(gè)參數(shù)的函數(shù)對(duì)象,分別類似于LISP的原始函數(shù)car和cdr的行為。currying能泛化為偏函數(shù)應(yīng)用(partial function application, PFA),p 這種函數(shù)將任意數(shù)量(順序)的參數(shù)的函數(shù)轉(zhuǎn)化為另一個(gè)帶剩余參數(shù)的函數(shù)對(duì)象2012-02-02
封裝運(yùn)動(dòng)框架實(shí)戰(zhàn)左右與上下滑動(dòng)的焦點(diǎn)輪播圖(實(shí)例)
下面小編就為大家?guī)硪黄庋b運(yùn)動(dòng)框架實(shí)戰(zhàn)左右與上下滑動(dòng)的焦點(diǎn)輪播圖(實(shí)例)。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-10-10
JavaScript與jQuery實(shí)現(xiàn)的閃爍輸入效果
這篇文章主要介紹了JavaScript與jQuery實(shí)現(xiàn)的閃爍輸入效果,結(jié)合實(shí)例形式分別分析了JavaScript與jQuery實(shí)現(xiàn)閃爍輸入效果的方法與具體使用技巧,需要的朋友可以參考下2016-02-02
Bootstrap分頁插件之Bootstrap Paginator實(shí)例詳解
Bootstrap Paginator是一款基于Bootstrap的js分頁插件,功能很豐富,個(gè)人覺得這款插件已經(jīng)無可挑剔了,感興趣的朋友跟著腳本之家小編一起學(xué)習(xí)吧2016-10-10
詳解實(shí)現(xiàn)一個(gè)通用的“劃詞高亮”在線筆記功能
這篇文章主要介紹了實(shí)現(xiàn)一個(gè)通用的“劃詞高亮”在線筆記文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04
在JavaScript中獲取請(qǐng)求的URL參數(shù)
在ASP.NET后臺(tái)代碼中,對(duì)于這樣的URL請(qǐng)求地址:http://www.abc.com?id=001,我們可以通過Request.QueryString["id"]的方法很容易的獲取到URL中請(qǐng)求的參數(shù)的值,但是要在前臺(tái)js代碼中獲取請(qǐng)求的參數(shù)的值,應(yīng)該怎么做呢?2010-12-12

