<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script>
window.onload = function() {
 
 var oUl = document.getElementById('ul1');
 
 /*
  元素.childNodes : 只读 属性 子节点列表集合
   标准下：包含了文本和元素类型的节点，也会包含非法嵌套的子节点
   非标准下：只包含元素类型的节点，ie7以下不会包含非法嵌套子节点
   
   childNodes只包含一级子节点，不包含后辈孙级以下的节点
  
  DOM节点的类型有很多种 12种
  
  元素.nodeType : 只读 属性 当前元素的节点类型
  
  元素节点 : 1
  属性节点 : 2
  文本节点 : 3
 */
 
 alert( oUl.childNodes.length );
 
 //alert( oUl.nodeType );
 
 //alert(oUl.childNodes[0].nodeType);
 
 //属性
 // 元素.attributes : 只读 属性 属性列表集合
 
 //alert( oUl.attributes.length );
 
 //alert( oUl.attributes[0].nodeType );
 
 /*for (var i=0; i<oUl.childNodes.length; i++) {
  
  if ( oUl.childNodes[i].nodeType == 1 ) {
   oUl.childNodes[i].style.background = 'red';
  }
  
 }*/
 
}
</script>
</head>

<body>
 <ul id="ul1" style="border: 1px solid red;">
        <li>11111 <span>span</span></li>
        <li>22222</li>
        <li>33333</li>
        <li>44444</li>
        <p>pppppppp</p>
    </ul>
</body>
</html>

JS-Dom概念的更多相关文章

  1. Js DOM 详解

    DOM事件类 基本概念 DOM事件的级别 1.DOM0 element.onclick = function(){} 2.DOM2 element.addEventListener("cli ...

  2. JS(DOM 和 BOM)

    JS(DOM 和 BOM) 常说的JS(浏览器执行的JS)包含两部分:1.JS基础知识(语法)(ECMA262标准)2.JS-Web-API(W3C标准) W3C 标准中关于 JS 的规定有:(只管定 ...

  3. 货架工程项目之js dom实现项目工程进度图

    笔者最近要负责有个项目工程网站的安装进度过程,实现的效果要求大概如下图所示 由于笔者没有参与到数据库的制作,得知他们这个项目设计工序的时候就一个开始日期的和完成日期,连整个项目的安装结束时间都没有简直 ...

  4. js DOM优化相关探索

    我在这尝试两个方面:-->DOM与js -->DOM与浏览器 (最近在秒味视频上学到不少,哈哈哈) 一.DOM与js 1.js与dom的交互问题 频繁的与dom交互,是一件浪费时间与金钱的 ...

  5. js DOM的几个常用方法

    <div id="div1">这是个测试</div> <p </p> <p </p> //js DOM的几个常用方法 / ...

  6. JS DOM 来控制HTML元素

    JS DOM 来控制HTML元素 (ps:这个有很多方法,挑一些详解,嘻嘻) 1.getElementsByName():获取name. ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ...

  7. Node.js回调概念

    什么是回调? 回调是一个异步等效的功能.在完成特定任务回调函数被调用. Node大量使用了回调.Node的所有的API都支持回调这样的一种方式. 例如,一个函数读取一个文件可能开始读取文件,并使得下一 ...

  8. JS Dom节点操作demo!

    通过黑马课程的学习,在这里分享一个js Dom中节点操作的小练习 需求:使用js创建一个4*3的表格table. onload = function(){ function c(tagName){ r ...

  9. JS基础概念

    JS基础概念 1. 算法及流程图 算法类型:1.算数算法:2.事务性算法(解决某个问题的方法和先后顺序). JS语法概述 1. 引入JS的方法 1.用<script src="&quo ...

  10. JavaScript之DOM概念

    一.DOM概念 1.DOM是什么? 1.1 起源.DOM起源于Netscape与Microsoft 公司的DHTML(动态HTML). 1.2 名词解释.Document Object Model,文 ...

随机推荐

  1. log4j相对路径找不到，处理方法

    http://blog.csdn.net/u012345283/article/details/40821833?utm_source=tuicool&utm_medium=referral

  2. jquery 中substring，substr，split的用法

    substring 方法 返回位于 String 对象中指定位置的子字符串. strVariable.substring(start, end) 参数 start 指明子字符串的起始位置,该索引从 0 ...

  3. JAVA 中数据库连接的方法之一

    /** * 数据库连接类 * */ package com.cn.MysqlConnect; import java.sql.Connection;import java.sql.DriverMana ...

  4. STM32 使用 FreeRTOS过程记录

    资源:http://blog.csdn.net/zhzht19861011/article/category/6191478 资源:可以下载安富莱的STM32-V5开发版资料中的FreeRTOS教程, ...

  5. 利用GCTA工具计算复杂性状/特征（Complex Trait）的遗传相关性（genetic correlation）

    如文章"Genome-wide Complex Trait Analysis(GCTA)-全基因组复杂性状分析"中介绍的GCTA,是一款基于全基因组关联分析发展的分析工具,除了计算 ...

  6. Linux下调试程序方法

    您可以用各种方法来监控运行着的用户空间程序:可以为其运行调试器并单步调试该程序,添加打印语句,或者添加工具来分析程序.本文描述了几种可以用来调试在 Linux 上运行的程序的方法.我们将回顾四种调试问 ...

  7. DNX SDK版本 “dnx-clr-win-x86.1.0.0-beta5”无法安装

    打开VS2015,出现 “DNX SDK版本 “dnx-clr-win-x86.1.0.0-beta5”无法安装,该解决方案将对此会话使用DNX SDK版本“dnx-clr-win-x86.1.0.0 ...

  8. Arguments Optional

    function add() { //return false; if(typeof arguments[0] !== "number" || arguments.length & ...

  9. Fresco支持的URIs

    //远程图片public void httpBtnOnClick(View view) { //网络图片URL String path = "http://p4.so.qhimg.com/t ...

  10. 实现type函数用于识别标准类型和内置对象类型

    function type(obj){ return Object.prototype.toString.call(obj).slice(8,-1); } var t=type(new Number( ...