javascript各种兼容性问题，不断更新
ie6-ie8 不支持textContent支持innerText
chrome 支持textContent innerText
fireFox 仅支持textContent不支持innerText
<body>
<div id="s1">
<p>ceshi </p>
</div>
</body> <script>
var s1=document.getElementById('s1');
console.log(s1.innerHTML); //输出 <p>ceshi </p>
console.log(s1.outerHTML); //输出<div id="s1">
<p>ceshi </p>
</div>
console.log(s1.innerText=s1.textContent); //输出ceshi
console.log(s1.outerText=s1.textContent); //输出ceshi
</script>
修改css样式
一般用js修改样式，都是获取id,如
var oDiv=document.getElementById("div1");
//alert(oDiv.style.width);
//获取非行间样式
但是這是修改行间的属性，还记得style有优先级吗，有时候我想改的不是行间的代码，改的是style标签的代码
就需要用到以下的函数
//ie下
alert(oDiv.currentStyle.width);
//chrome 和firefox下
alert(getComputedStyle(oDiv,false).width);
这就涉及到兼容性问题
解决此问题就最好用if语句
if(oDiv.currentStyle)
{
alert(oDiv.currentStyle.width);
}
else
{
alert(getComputedStyle(oDiv,false).width);
}
childNodes,firstElementChild,firstChild
首先先看看childnodes
<body>
<ul id="ul1">
<li></li>
<li></li>
</ul> </body> <script>
var oUl =document.getElementById("ul1");
for (var i=0;i<oUl.childNodes.length;i++)
{
if (oUl.childNodes[i].nodeType==1) //nodeType=3表示文本节点，即空格，=1就是标签节点
{
oUl.childNodes[i].style.background='red';
}
}
</script>
這里的childNodes.length为5
和我们想的2相差很大，原因是因为childnodes在ie可以正常显示为2，但是在谷歌和火狐浏览器中就显示5
因为谷歌和火狐浏览器把<li></li>前面的空格也当作一个childnode，叫文本节点。
为了避免這个问题
可以用children、
for (var i=0;i<oUl.children.length;i++)
{
oUl.children[i].style.background='green';
}
这是全兼容的，
获取第一个节点有ie和火狐也有不同的函数，为了兼容性，可以写成這样
if (oUl.firstElemenChild) //用于火狐和chrome
{
oUl.firstElementChild.style.background='black';
}
else
{
oUl.firstChild.style.background="black"; //用于ie5-7
}
javascript各种兼容性问题，不断更新的更多相关文章
- JAVASCRIPT 浏览器兼容性问题及解决方案列表
JAVASCRIPT 浏览器兼容性问题及解决方案列表(1)获取HTML元素只兼容IE:document.all.hello hello 兼容所有: document.getElementById(“h ...
- JavaScript 事件兼容性写法
1.以下是JavaScript事件兼容性写法,使用者可以随意使用,兼容所有浏览器.包括IE6(亲测) <!DOCTYPE html> <html> <head> & ...
- JavaScript 使用技巧（持续更新）
JavaScript 使用技巧(持续更新) 类型检测 使用Object.prototype.toString.call(obj)的方式. 因为无论typeof还是instanceof都无法做到精确判断 ...
- 目前最全的浏览器/CSS选择器兼容性总结(2009-8-10更新)
2009年2月24日,Safari 4.0 beta版正式发布,Safari从它的3.2版本开始就已经支持所有的CSS选择器(包括最新的CSS3).不过为了方便大家的工作,下面提供了最新版本的CSS选 ...
- javascript opacity兼容性随笔
一.CSS兼容代码 .transparent { filter:alpha(opacity=50); /* IE */ -moz-opacity:0.5; /* FireFox old version ...
- javascript event兼容性随笔
一.前言 function ConvertEvent(e, element) { var event = e || window.event; var resultEvent = { event: e ...
- javascript Xml兼容性随笔
一.前言 (function (window) { if (!window.jasen) { window.jasen = {}; } if (!window.jasen.core) { window ...
- javascript position兼容性随笔
一.Javascript源码 if (!window.jasen.core.Position) { window.jasen.core.Position = {}; } function Size(w ...
- JavaScript及兼容性笔记
1. Json to String JSON.stringify(jsonobj)//(IE8+,Chrome 1+,FF 3+) //参考 http://www.nowamagic.net/libr ...
随机推荐
- Java的最大优势还是跨平台么？
之前码农界有码农说Java的最大优势是跨平台,真的是这样么?其实当时网络没这么火爆的时候,确实是这样的,但现在这已然不是了. 跨平台还是Java的最大优势么? 有跨平台需求的仅仅是客户端应用,而不是服 ...
- ubuntu用终端卸载软件
我们需要知道我们要卸载的软件的名称,sudo apt-get autoremove --purge 之后输入软件名称,可以先输入前缀之后按tab,会自动补全. 现在不要急着回车,我们来讲解一下这个命令 ...
- 51nod 1120 机器人走方格 V3 卡特兰数 lucas定理
N * N的方格,从左上到右下画一条线.一个机器人从左上走到右下,只能向右或向下走.并要求只能在这条线的上面或下面走,不能穿越这条线,有多少种不同的走法?由于方法数量可能很大,只需要输出Mod 100 ...
- js复习（一）
一.常用数据框1.alert(""):警告对话框,作用是弹出一个警告对话框 2.confirm(""):确定对话框,弹出一个带确定和取消按钮的对话框--确定返回 ...
- ADO.NET（查询、属性扩展）
一.ADO.NET 融合面向对象的查询语句 1.只查询一条数据 //数据访问中的select方法 public stu select(string xuehao) { stu s = null; cm ...
- centos7编译安装nginx1.8
安装pcre wget ftp://ftp.csx.cam.ac.uk/pub/software/programming/pcre/pcre-8.38.tar.gz tar -zxvf pcre-8. ...
- java多线程之ThreadLocal
ThreadLocal为每个线程保存变量,以保证数据同步. package Thread.Common; import java.util.Random; import java.util.concu ...
- code md5
using System; using System.Collections.Generic; using System.Linq; using System.Security.Cryptograph ...
- 区分DPI、分辨率(PPI)、图像的物理大小、像素宽度
分辨率都知道,越高越清晰. 一.描述分辨率的单位有: dpi(点每英寸).lpi(线每英寸)和ppi(像素每英寸).但只有lpi是描述光学分辨率的尺度的.虽然dpi和ppi也属于分辨率范畴内的单 ...
- Xcode5.0使用iOS6.1SDK及模拟器
最近项目中,介于测试人员提出的问题,有些情况只在ios6的设备上才能显现,而本机的xcode已升级到最新的5.0,这可如何是好呢,在网上搜索了一番,找到如下方法解决此问题: 1.打开xcode5.0的 ...