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. ios的runtime为什么可以动态添加方法

    一句话概括 每个instance都有一个isa,这个isa,里面含有所有的方法列表,ios提供库函数增加,修改,即实现了动态添加方法

  2. HTML5 中已经可以用 Ajax 上传文件了，而且代码非常简单，借助 FormData 类即可发送文件数据。

    <?phpif (isset($_POST['upload'])) { var_dump($_FILES); move_uploaded_file($_FILES['upfile']['tmp_ ...

  3. 从1970年1月1日00:00:00 GMT以来此时间对象表示的毫秒数转化为Datetime

    1970年1月1日(00:00:00 GMT)Unix 时间戳(Unix Timestamp)对时间转换 将Long类型转换为DateTime类型 /// <summary> /// 将L ...

  4. (WCF) WCF Service Hosting.

    3 Options. 1. Host inside of an application. 2. Host into Windows service. 3. Host into IIS 参考: http ...

  5. CF 120F Spider 树的直径 简单题

    一个男孩有n只玩具蜘蛛,每只蜘蛛都是一个树的结构,现在男孩准备把这n只小蜘蛛通过粘贴节点接在一起,形成一只大的蜘蛛.大的蜘蛛也依然是树的结构.输出大的蜘蛛的直径. 知识: 树的直径是指树上的最长简单路 ...

  6. C# 中的事件含义介绍

    AutoSizeChanged 当 AutoSize 属性的值更改时发生.(从 ButtonBase 继承.)   BackColorChanged 当 BackColor 属性的值更改时发生.(从 ...

  7. 【JavaScript】创建命名空间，Class，LOG

    JxUnderscore(function (J, _, root) { var isWindow, deepObject, Namespace, Class, LOG; /** * 一个对象是否为w ...

  8. 更改EGit的user settings中默认的location

    在系统的环境变量中添加变量HOME,值为C:\Users\Kane.Sun\ 记得要讲users改为首字母大写,不然可能会有问题.

  9. 一个类似bootstrap的foundation

    提供了和BOOTSTRAP一样的功能,但明显比bootstrap有更好的效果 比如 <button> 直接就添加了样式了. http://www.foundcss.com/ Bootstr ...

  10. 为何你的php代码没有写结束标签

    PHP闭合标签"?>"在PHP中对PHP的分析器是可选的.但是,如果使用闭合标签,任何由开发者,用户, 或者FTP应用程序插入闭合标签后面的空格都有可能会引起多余的输出.ph ...