美文网首页
DOM操作元素节点的注意事项

DOM操作元素节点的注意事项

作者: hyperRect | 来源:发表于2017-05-29 04:34 被阅读0次

1. 平稳退化, 检查JavaScript DOM函数的支持程度.

比如一些浏览器不支持getElementsByTagName等。。。

就要先判断一下 

if(!document.getElementsByTagName)  return false;

if(!document.getElementsById)  return false; //这个再不支持就太过分了。。


2. 注意判断node节点的 nodeType. 由于DOM 默认方法中的 nextSibling, firstChild, lastChild,childNodes

html:

<div id="main">

   <h1>anything</h1>

 <h2></h2>

</div

JS:

var div1 = document.getElementById("main");

var childeNodes = div1.childNodes;

for (var i = childeNodes.length - 1; i >= 0; i--) {

alert(childeNodes[i].nodeType);

}

如下, 会输出3, 1, 3, 1, 3.

因为div和h1之间还有默认的一个为“”的文本节点。 文本节点nodeType =3.

相关文章

  • DOM (javascript DOM节点操作)

    DOM (javascript DOM节点操作) 本节目录 查找DOM元素 DOM节点操作 javascript操...

  • DOM

    一.dom操作 dom的组成 元素节点属性节点文本节点 通过nodeType查看类型 1 元素节点 ,2 属性节...

  • 第十七章 DOM基础

    要点: DOM介绍 查找元素 DOM节点 节点操作 什么是 DOM? DOM即文档对象,针对HTML和XML文档的...

  • JavaScript基础(5)-(节点的操作)

    1.元素节点操作: 2.访问元素节点: 3.DOM操作 4.节点属性的设置; 调用者:元素本身 返回...

  • DOM操作元素节点的注意事项

    1. 平稳退化, 检查JavaScript DOM函数的支持程度. 比如一些浏览器不支持getElementsBy...

  • 18.DOM 基础

    学习要点: 1.DOM 介绍2.查找元素3.DOM 节点4.节点操作 DOM(Document Object Mo...

  • 前端基本功:JS必记知识点+案例(五)DOM节点属性

    昨日重点: dom 我们操作最多的就是 元素节点 标签节点 标签 li span 节点的访...

  • Chrome DevTools

    概览 Element 第一部分:操作dom元素查看DOM树选取DOM节点操作DOM节点 第二部分查看界面样式修改界...

  • 网络编程(二十一) JavaScript(11)

    一、 节点操作 1.1 为什么学习节点操作 获取元素通常使用两种方式:【1】利用DOM提供的方法获取元素 docu...

  • jS|DOM操作

    DOM节点的获取 DOM节点的创建 DOM节点删除 修改DOM元素 将指定两个DOM元素交换位置

网友评论

      本文标题:DOM操作元素节点的注意事项

      本文链接:https://www.haomeiwen.com/subject/hllkfxtx.html