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各种兼容性问题，不断更新的更多相关文章

  1. JAVASCRIPT 浏览器兼容性问题及解决方案列表

    JAVASCRIPT 浏览器兼容性问题及解决方案列表(1)获取HTML元素只兼容IE:document.all.hello hello 兼容所有: document.getElementById(“h ...

  2. JavaScript 事件兼容性写法

    1.以下是JavaScript事件兼容性写法,使用者可以随意使用,兼容所有浏览器.包括IE6(亲测) <!DOCTYPE html> <html> <head> & ...

  3. JavaScript 使用技巧（持续更新）

    JavaScript 使用技巧(持续更新) 类型检测 使用Object.prototype.toString.call(obj)的方式. 因为无论typeof还是instanceof都无法做到精确判断 ...

  4. 目前最全的浏览器/CSS选择器兼容性总结(2009-8-10更新)

    2009年2月24日,Safari 4.0 beta版正式发布,Safari从它的3.2版本开始就已经支持所有的CSS选择器(包括最新的CSS3).不过为了方便大家的工作,下面提供了最新版本的CSS选 ...

  5. javascript opacity兼容性随笔

    一.CSS兼容代码 .transparent { filter:alpha(opacity=50); /* IE */ -moz-opacity:0.5; /* FireFox old version ...

  6. javascript event兼容性随笔

    一.前言 function ConvertEvent(e, element) { var event = e || window.event; var resultEvent = { event: e ...

  7. javascript Xml兼容性随笔

    一.前言 (function (window) { if (!window.jasen) { window.jasen = {}; } if (!window.jasen.core) { window ...

  8. javascript position兼容性随笔

    一.Javascript源码 if (!window.jasen.core.Position) { window.jasen.core.Position = {}; } function Size(w ...

  9. JavaScript及兼容性笔记

    1. Json to String JSON.stringify(jsonobj)//(IE8+,Chrome 1+,FF 3+) //参考 http://www.nowamagic.net/libr ...

随机推荐

  1. Linux下Wi-Fi的实现：wireless_tools和wpa_supplicant

    平台为hi35XX,在Liunx下借助wireless_tools和wpa_supplicant(因为现在的无线WIFI网络大多是wpa加密.所以需要移植wpa_supplicant工具)等工具实现w ...

  2. Android的CursorLoader用法小结

    工作内容集中到Contact模块,这个应用查询数据的地方很多,其使用了CursorLoader这个工具大大简化了代码复杂度.Android自3.0提供了Loader机制,当时google的API只是简 ...

  3. javascript 异步编程-setTimeout

    javascript的执行引擎是单线程的,正常情况下是同步编程的模式,即是程序按照代码的顺序从上到下依次顺序执行.只要有一个任务耗时很长,后面的任务都必须排队等着,会拖延整个程序的执行.常见的浏览器无 ...

  4. (C/C++) Interview in English. - Memory Allocation/Deallocation.

    Q: What is the difference between new/delete and malloc/free? A: Malloc/free do not know about const ...

  5. java.lang.ClassNotFoundException: org.eclipse.jetty.plus.webapp.EnvConfiguration

    最近刚接触jetty,在myeclipse8.6中加入了一个项目,运行时就出了这个java.lang.ClassNotFoundException: org.eclipse.jetty.plus.we ...

  6. poj 2104 K-th Number(主席树 视频)

    K-th Number 题意: 给你一些数,让你求一个区间内,第k大的数是多少. 题解: 主席树第一题,看的qsc视频写的,戳戳戳 学到了unique函数,他的作用是:把相邻的重复的放到后面,返回值是 ...

  7. NeHe OpenGL教程 第三十九课：物理模拟

    转自[翻译]NeHe OpenGL 教程 前言 声明,此 NeHe OpenGL教程系列文章由51博客yarin翻译(2010-08-19),本博客为转载并稍加整理与修改.对NeHe的OpenGL管线 ...

  8. 转-Activity中使用orientation属性讲解及需注意的问题

    http://www.software8.co/wzjs/yidongkaifa/6504.html 今天遇到了一个关于orientation的问题查了点资料记录一下,只有点点滴滴的积累,才能让我们更 ...

  9. frame动画

    <?xml version="1.0" encoding="utf-8"?> <animation-list xmlns:android=&q ...

  10. ssh-keygen+ssh-copy-id无密码登录远程LINUX主机（转载）

    From:http://blog.163.com/lgh_2002/blog/static/44017526201011333227161/ 1.创建公钥和私钥 ligh@local-host$ ss ...