华强方特网站开发,网站可做2个首页吗,阿里巴巴怎么做公司网站,昆明响应式网站制作做为一个web前端#xff0c;处理和了解浏览器差异一个重要问题.下面将介绍本人在工作中的一些笔记总结#xff0c;先介绍没有使用js库的情况。 1. setAttribute方法设置元素类名 #xff1a; 在jQuery中#xff0c;直接使用attr()方法即可#xff0c;可在原生的JS中
e… 做为一个web前端处理和了解浏览器差异一个重要问题.下面将介绍本人在工作中的一些笔记总结先介绍没有使用js库的情况。 1. setAttribute方法设置元素类名 在jQuery中直接使用attr()方法即可可在原生的JS中
element.setAttribute(class,newClassName) //这个是W3C的标准在兼容W3C标准的浏览器中有效可是IE才是国内用户的主旋律 element.setAttribute(className,newClassName) //这样的设置在IE中才能有效 element.className newClassName //所有浏览器有效(只要支持javascript) 好了开篇说完了这篇文章的目的也就是介绍浏览器差异的同时使前端的朋友们了解如果用最有效的方法去解决问题下面继续。 2. FireFox没有window.event对象只有event对象,IE里只支持window.event,而其他主流浏览器两者都支持,所以一般写成
function handle(e) { e e || event; ... } 3. DOMContentLoaded事件原理对window.onload事件是当页面解析/DOM树建立完成并完成了如图片、脚本、样式表等所有资源的下载后才触发的。这对于很多实际的应用而言有点太“迟”了比较影响用户体验。为了解决这个问题FF中便增加了一个DOMContentLoaded方法与onload相比该方法触发的时间更早它是在页面的DOM内容加载完成后即触发而无需等待其他资源的加载(这个也就是jquery.ready()事件的实现原理)。
//以下是jQuery 1.4.2版本的原版分析 bindReady: function() { if ( readyBound ) { return; } readyBound true; // Catch cases where $(document).ready() is called after the // browser event has already occurred. if ( document.readyState complete ) { return jQuery.ready(); } // Mozilla, Opera and webkit nightlies currently support this event if ( document.addEventListener ) { // Use the handy event callback document.addEventListener( DOMContentLoaded, DOMContentLoaded, false ); // A fallback to window.onload, that will always work window.addEventListener( load, jQuery.ready, false ); // If IE event model is used } else if ( document.attachEvent ) { // ensure firing before onload, // maybe late but safe also for iframes document.attachEvent(onreadystatechange, DOMContentLoaded); // A fallback to window.onload, that will always work window.attachEvent( onload, jQuery.ready ); // If IE and not a frame // continually check to see if the document is ready var toplevel false; try { toplevel window.frameElement null; } catch(e) {} if ( document.documentElement.doScroll toplevel ) { doScrollCheck(); } } } 设计思路 - 将Webkit与Firefox同等对待都是直接注册DOMContentLoaded事件但是由于Webkit是在525以上版本才引入的因此存在兼容性的隐患。 对于IE首先注册document的onreadystatechange事件经测试该方式与window.onload相当依然会等到所有资源下载完毕后才触发。 之后判断如果是IE并且页面不在iframe当中则通过setTiemout来不断的调用documentElement的doScroll方法直到调用成功则出触发DOMContentLoaded。1 jQuery对于IE的解决方案的原理是在IE下DOM的某些方法只有在DOM解析完成后才可以调用doScroll就是这样一个方法反过来当能调用doScroll的时候即是DOM解析完成之时与prototype中的document.write相比该方案可以解决页面有iframe时失效的问题。此外jQuery似乎担心当页面处于iframe中时该方法会失效因此实现代码中做了判断如果是在iframe中则通过document的onreadystatechange来实现否则通过doScroll来实现。不过经测试即使是在iframe中doScroll依然有效。 4. 学会使用IE的条件注释。许多前端总是在抱怨万恶的IE,确实,处理兼容性的问题确实会越来越恶心,可是没有办法,既然没有办法改变,那么请享受...
!--[if IE] h1您正在使用IE浏览器/h1 ![endif]-- !--[if IE 5] h1版本 5/h1 ![endif]-- !--[if IE 5.0] h1版本 5.0/h1 ![endif]-- !--[if IE 5.5] h1版本 5.5/h1 ![endif]-- !--[if IE 6] h1版本 6/h1 ![endif]-- !--[if IE 7] h1版本 7/h1 ![endif]-- 今天就先总结到这里吧下周收假回来有时间发高级AJAX篇希望能对新手或者有需要的人有所帮助.由于文笔有限写的不好也请见谅这个刚刚开始写博客成长阶段嘛。哈哈...
