JSDOM编程艺术-笔记-ch5 平稳退化&分离JS(BY 弹窗实例)
来源:互联网 发布:社交网络算法 编辑:程序博客网 时间:2024/06/06 07:10
使用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=# onclick=”javascript:popUP(‘winUrl’);”>链接名</a>
#是未指向任何内部目标的内部链接,或者指向当前文档的开头,这样会创建一个空链接,依赖onclick属性实现JS代码。
(3)平稳退化方案:使用有效链接
<a href=”winUrl” onclick=”popUp(‘winUrl’); return false;”></a>
<a href=”winUrl” onclick=”popUp(this.getAttribute(‘href’));return false;”></a>使用JS语言
<a href=”winUrl” onclick=”popUp(this.href);return false;”></a>使用DOM ★
在JS中调用事件/分离JS代码(渐进增强):
1.将所有链接建立一个数组。
2.遍历数组。
3.如果某个链接的class属性等于popUP,就表示链接被点击时调用此函数。(A.将此链接的href属性传递给popUP函数,取消链接的默认行为,不将访问者带离窗口。)
【JS将一个事件添加到HTML文档的元素上:Elemnet.event=action...;】
- JSDOM编程艺术-笔记-ch5 平稳退化&分离JS(BY 弹窗实例)
- js平稳退化,性能考虑(javascript DOM 编程艺术)
- 平稳退化、渐进增强、分离js
- JSDOM编程艺术-ch5-向后兼容&性能考虑
- JSDOM编程艺术
- JSDOM编程艺术
- javascript DOM编程艺术笔记——CH5 Best practise
- javascript 基础 增强版JS图片库 平稳退化
- javascript中的平稳退化
- JavaScript平稳退化
- JavaScript平稳退化
- javascript平稳退化
- 平稳退化(优雅降级)与渐进增强
- 平稳退化(优雅降级)和渐进增强
- JS DOM编程艺术-笔记
- js语法 编程艺术笔记
- 渐进增强和平稳退化
- JavaScript打开link平稳退化
- 各种JSON的maven引用
- Android O / Android 8.0 新特性及开发指南
- matlab2c使用c++实现matlab函数系列教程-find函数
- 【数据结构】数据结构与算法分析第一章部分题目
- div+css网页标准布局实例
- JSDOM编程艺术-笔记-ch5 平稳退化&分离JS(BY 弹窗实例)
- 导航配置-movebase参数详解(持续更新中)
- 虚拟币交易平台对接钱包是使用 Merkle Tree端口
- 验证码生成和切换
- SQL数据库中高级查询 表连接与子查询
- test
- hdu-3007(计算几何+最小覆盖圆)
- 设计模式-工厂方法
- Rxjava一些使用场景应用