常用跨浏览器设置——JS总结
2015-05-31 21:38
591 查看
常用跨浏览器设置——JS总结
1.跨浏览器添加事件
2.跨浏览器移除事件
3.跨浏览器字符编码
4.跨浏览器获取可视范围内窗口大小
5.跨浏览器获取滚动条位置
封装——抽象
通过抽象、封装而得到像公式一样的函数体,很多功能函数,语言本身没有给出,但给出了基本获取方法,我们需要的功能可能还需要进行适当的拼装和使用适当的算法处理,最终得到适宜我们使用的函数。
1.跨浏览器添加事件
<pre name="code" class="javascript"> function addEvent(obj,type,fn) { if (obj.addEventListener) { obj.addEventListener(type,fn,false); } else if (obj.attachEvent) { obj.attachEvent('on' + type, fn); } }
2.跨浏览器移除事件
<pre name="code" class="javascript"> function removeEvent(obj,type,fn) { if (obj.removeEventListener) { obj.removeEventListener(type,fn,false); } else if ( obj.detachEvent) { obj.detachEvent('on' + type,fn); } }
3.跨浏览器字符编码
function getCharCode(evt) { var e = evt || window.event ; if (typeof e.charCode == 'number') { return e.charCode; } else { return e.keyCode; } }
4.跨浏览器获取可视范围内窗口大小
<pre name="code" class="javascript"> function getInner() { if(typeof window.innerWidth != 'undefined'){ return { //属性试-封装 width:window.innerWidth, height:window.innerHeight } } else { return { width:document.documentElement.clientWidth, height:document.documentElement.clientHeight } } }
5.跨浏览器获取滚动条位置
function getScroll(){ return{ top:document.documentElement.scrollTop || document.bady.scrollTop, left:document.documentElement.scrollLeft || document.body.scrollLeft } }
封装——抽象
通过抽象、封装而得到像公式一样的函数体,很多功能函数,语言本身没有给出,但给出了基本获取方法,我们需要的功能可能还需要进行适当的拼装和使用适当的算法处理,最终得到适宜我们使用的函数。
相关文章推荐
- JavaScript 输出
- JavaScript 用法
- JavaScript学习9:DOM操作表格及样式
- Backbone 模板 underscore template默认的转义符<%= %> 与jsp的冲
- js如何声明数组
- json类型
- JavaScript 简介
- JavaScript 开发的45个经典技巧
- 使用HIGHCHARTS绘制服务端返回数据曲线图
- 【javascript】表单
- IDF实验室—不难不易的js加密
- javascript深入理解闭包
- JSEE总结(一)——JNDI
- 由表及里,对象逐层响应【冒泡】——JS总结
- JS事件总结
- DOM节点——JS总结
- JavaScript基于原型的继承
- js-定时任务setInterval,setTimeout,clearInterval,clearTimeout
- javascript && 和 || 最清晰的描述
- [LeetCode][JavaScript]ZigZag Conversion