跨浏览器注意事项

完善JavaScript编程技能将引导我们不断前行，尤其是目前，除了浏览器端以外，JavaScript还能够使用Rhino、V8或Node.js库等JavaScript引擎在服务器端运行。但开发基于浏览器的JavaScript应用程序时，我们首先要应对：浏览器及其令人恼火的问题和矛盾。

理想世界中，所有的浏览器中都没有bug，并且支持以一致的方式支持Web标准，但是我们都知道我们并不生活在这种世界中。

近来浏览器的质量已经有了很大的改善，但仍有一些bug、缺失的API和不同的浏览器的特定缺陷，我们需要解决这些问题。制定解决这些浏览器问题的综合性策略并熟悉不同浏览器之间的区别和缺陷，和精通JS本身同等重要。

对于这些差异，在编写浏览器应用程序或JavaScript库时，决定支持哪些浏览器是一个重要考虑事项。我们可能想支持所有的浏览器，但受限于开发和测试的资源限制。Yahoo提出送松耦式方式来解决这个问题，也被称为分级浏览器支持。在这种技术中，我们创建一个浏览器支持矩阵，作为记录浏览器和其平台的重要性快照

由于支持大部分的平台和浏览器组合是不切实际的，因此我们必须权衡支持各种浏览器的成本与收益。任何类似的分析，都必须要考虑到多个因素，主要有如下几点：

（1）目标受众的期望和需求

（2）浏览器的市场份额

（3）支持浏览器所需的工作量

时间： 2024-11-05 15:59:18

跨浏览器注意事项的相关文章

跨浏览器复制神器 ZeroClipboard 2.x快速入门详解

有些时候,我们希望让用户在网页上完成某个操作就能自动将指定的内容复制到用户计算机的剪贴板中.但是出于安全原因,大多数现代浏览器都未提供通用的剪贴板复制接口(或即便有,也默认被禁用).只有IE浏览器可以通过如下方式来进行复制. window.clipboardData.setData("Text", "这里是需要复制的文本内容") 想要实现跨浏览器的复制功能,我们就可以使用 ZeroClipboard. ZeroClipboard 及其原理介绍 ZeroClipboa

常用跨浏览器设置——JS总结

常用跨浏览器设置--JS总结 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); } }

跨浏览器resize事件分析

resize事件 原生事件分析 window一次resize事件: IE7 触发3次, IE8 触发2次, IE9 触发1次, IE10 触发1次 Chrome 触发1次 FF 触发2次 Opera 触发1次 Safari 触发1次 场景分析 window resize时,部分组件需要重置大小(一次):部分组件不需要重置大小: 开源库分析 jquery-resize 优点:使用简便 $('#div1').on('resize', function (e) { console.log('[div1

JS-DOM2级事件对象跨浏览器处理（已封装）

1 var eventUill = { 2 //添加事件 3 addHander: function(element, type, handler) { 4 if(element.addEventListener) { 5 element.addEventListener(type, handler, false); 6 } else if(element.attachEvent) { 7 element.attachEvent('on' + type, handler); 8 } else {

JS 事件（4）——跨浏览器的事件对象

跨浏览器的事件对象详解 封装事件对象 1 var event_util = { 2 //添加事件 3 addHandler: function(element, type, handler) { 4 if(element.addEventListener) { 5 element.addEventListener(type, handler, false); 6 } else if(element.attachEvent) { 7 element.attachEvent("on" +

跨浏览器的placehold

如何实现跨浏览器的placeholder效果呢? 先看下效果 js代码如下: $('#username').placeholder({ word: '用户名', color: '#ddd', normalFontColor: '#f00', maxLen: 4, minLen: 2, errorBorderClass: 'errorBorder', keyup_callback: function () { console.log('keyup_callback'); } }); $('#pas

EventUtil——跨浏览器的事件对象

前言:什么是EventUtil? 在JavaScript中,DOM0级.DOM2级与旧版本IE(8-)为对象添加事件的方法不同 为了以跨浏览器的方式处理事件,需要编写一段“通用代码”,即跨浏览器的事件处理程序 习惯上,这个方法属于一个名为EventUtil的对象 编写并使用该对象后,可保证处理事件的代码能在大多数浏览器下一致的运行 本文将围绕着EventUtil对象展开,并提供该通用对象代码以作参考分享 文章主要内容参考书籍为<JavaScript高级程序设计>([美]Nicholas C.Z

跨浏览器的placeholder-jQuery版（jQuery插件EnPlaceholder）

案例:整搜索框,需要默认占位符为"请输入关键词",获取焦点时,占位符消失或不可用(不影响正常输入),丢失焦点后,若用户无内容输入,占位符继续出现,继续占位.这种代码我想前端们已经很容易就写出来了吧,现在HTML5原生就有这个"placeholder"属性,效果与上边案例描述的一样(各支持的浏览器内部表现可能不一致,但是作用是一致的),那么这一属性该怎么优雅降级到支持所有现代浏览器呢?答案还是脚本即JavaScript. 上述案例的一个图例:     下面我们就使用

处理跨浏览器的事件处理程序

事件:事件是用户或浏览器自身执行的某些动作,例如 : click   load   mouseover 事件处理程序:用于响应某个事件的函数 在不同的浏览器,DOM中,事件处理程序是响应某个事件的函数 DOM0:中事件处理函数  event:onclick=function              删除程序:event:onclick=null: DOM 2:addEventListener()            removeEventListener(); 他们都接受三个参数,要处理的事