浅析JavaScript中浏览器的兼容问题.docVIP

浅析JavaScript中浏览器的兼容问题 下面小编就为大家带来一篇浅析JavaScript中浏览器 的兼容问题。小编觉得挺不错的，现在分享给大家，也给 大家做个参考 浏览器兼容性问题是在实际开发中容易忽略而又最重 要的一部分。我们在讲老版本浏览器兼容问题之前，首先 要了解什么是能力检测，它是来检测浏览器有没有这种能 力，即判断当前浏览器是否支持要调用的属性或者方法。 下面做了一些简短的介绍。 1、innerTex t 和 innerCont ent inne rText 和 inner Content 的作用相同 innerT extIE8之前的浏览器支持 inne rContent 老版本的 Firefox 支持 新版本的浏览器两种方式都支持 1//老版本浏览器兼容inner Text和innerC ontent 2if (element? te xtContent) { 3nbsp; nbs p; returnele ment? textCo ntent; 4nbsp ;}else { 5n bsp; nbsp; re turnelement . innerText; 6nbsp;} 2、获取兄弟节点/元素的兼容性问题 nbsp;l)兄弟节点，所有浏览器都支持 nextSibl ing下一个兄弟节点，可能是非元素节点; 会获取到文本节点 pr eviousSibli ngnbsp;_b一个兄弟节点，可能是非 元素节点；会获取到文本节点 n bsp;2)兄弟元素，IE8以前不支持 previousEle mentSibling获取上一个紧邻的兄弟元 素，会忽略空白nbsp ; nextEle mentSibling nbsp;获取下一个紧邻的兄弟 元素，会忽略空白 //兼容浏览器 //获取下一个紧邻的兄弟元素 functiong etNextEleme nt (element) { nbsp;//能力检测 nbsp; if (element. nex tElementSib ling) { nbs p;nbsp;retu rnelement? n extElementS ibling; nbsp :}else{ nb sp;nbsp;nbs p; varnode=e lement? next Sibling; n bsp;nbsp;nb sp;while(no deamp;amp;n ode? nodeTyp e!==l) { nb sp;nbsp;nbs p;nbsp;nbsp ;node=node? nextibling; nbsp;nbsp;n bsp:} nbsp ;nbsp;nbsp;returnnode; nbsp;} nbsp;} /** *返回上一个元素 *par amelement *r eturns {*} */ functiong etPreviousE lement (elem ent) { nbsp ; if (element ? previousEl ementSiblin g) { nbsp;n bsp;returne lement. prev iousElement Sibling; nbs p;} else { n bsp;nbsp; va rel=element ? previousSi bling; nbs p;nbsp;whil e (elamp; amp ;el? nodeTyp e!二二 1) { nb sp;nbsp;nbs p;el=e 1. pre viousSiblin g; nbsp;nbsp ;nbsp;} nbsp ;nbsp;retur nel; nbsp;} /** *返回第一个元素first ElementChil d的浏览器兼容 * par amparent *re turns {/***返回最后一个元素 /** *返回最后一个元素 parampare nt /** *获取当前元素的所有兄弟元素 *p aramelement */ functionge tFirstEleme nt (parent) { nbsp; if (p arent? first ElementChil d) { nbsp;n bspjreturnp arent. first ElementChil d; nbsp;} els e { nbsp;nb sp: varel=pa rent. firstC hild; nbsp ;nbsp;while (elamp;amp;e1. nodeType !==1){ nbs p;nbsp;nbsp ;el=eL next Sibling; nbs p;nbsp;nbsp ;} nbsp;nbsp jreturnel; n bsp:} *ret