使用JS前需要确认:
1.这么做会对用户的浏览体验产生那些影响?---非必要的不添加。
2.如果用户的浏览器不支持JS怎么办?---平稳退化graceful degradation。
==》渐进增强:用一些额外的信息去包裹原始数据。
实例:
JS代码弹窗实现
Function popUP(winUrl)
{window.open(winUrl,name,features);}
html语句内嵌的调用JS弹窗函数:
(1)不能平稳退化:定义JS函数,使用伪协议
<a href=”javascript:JS函数名(‘JS函数参数’);”>链接名</a>
(2)不能平稳退化:onclick
<a href=# οnclick=”javascript:popUP(‘winUrl’);”>链接名</a>
#是未指向任何内部目标的内部链接,或者指向当前文档的开头,这样会创建一个空链接,依赖onclick属性实现JS代码。
(3)平稳退化方案:使用有效链接
<a href=”winUrl” οnclick=”popUp(‘winUrl’); return false;”></a>
<a href=”winUrl” οnclick=”popUp(this.getAttribute(‘href’));return false;”></a>使用JS语言
<a href=”winUrl” οnclick=”popUp(this.href);return false;”></a>使用DOM ★
在JS中调用事件/分离JS代码(渐进增强):
1.将所有链接建立一个数组。
2.遍历数组。
3.如果某个链接的class属性等于popUP,就表示链接被点击时调用此函数。(A.将此链接的href属性传递给popUP函数,取消链接的默认行为,不将访问者带离窗口。)
【JS将一个事件添加到HTML文档的元素上:Elemnet.event=action...;】