<!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. 315. Count of Smaller Numbers After Self

    You are given an integer array nums and you have to return a new counts array. The counts array has ...

  2. VC++ 如何使窗体最大化或是最小化

    最大化最小的使得的函数是 ShowWindow函数 ShowWindow(SW_SHOWMINIMIZED);//最小化 ShowWindow(SW_SHOWMAXIMIZED);//最大化 Show ...

  3. Cocos学习-----Cocos2Dx安装

    昨天晚上从官网下载了cocos2dx,打开发现win下工程已经是2010了最少,很是郁闷.尝试着在08下新建工程然后添加文件,发现还是很麻烦,于是下载了vs2010,打开编译报错:error C206 ...

  4. RapidXML 试用

    近半年来断断续续的封装一些SDK,在兼顾跨平台.易用性和高效率上还要顾及到对外dll的大小问题.由于之前解析SVG文件的用到了一个XML解析库xercesc,这个DLL实在巨大近4M,于是尝试用新的X ...

  5. [原创.数据可视化系列之六]使用openlyaers进行公网地图剪切

    进行地图开发的过程中,我一般使用天地图或者微软的地图作为地图,因为这两种地图的经纬度偏差最小,基本可以满足用户需求,比如: 不用说,都是全部地图,这也是最常用的一种方法. 但是用户说,我只看大连的地图 ...

  6. iframe高度调整

    //设置iframe高度 function setHeight(){ var originalHeight=$(window).height(); var headerHeight=$('.heade ...

  7. angularJS--ngSelect

    给select绑定ng-model时,经常会出现首选第一个option值是undefined.如图, 源代码 <select ng-model="newSupplier.company ...

  8. Html登录表单阻止自动填充

    设置属性 autocomplete="off" 阻止浏览器从cache获取数据填充登录表单. <input type="text" name=" ...

  9. mina IoBuffer

    mina IoBuffer 常用方法   Limit(int) 如果position>limit, position = limit,如果mark>limit, 重置mark Mark() ...

  10. Python：线程

    Python中创建线程有两种方式:函数或者用类来创建线程对象. 函数式:调用 _thread 模块中的start_new_thread()函数来产生新线程. 类:创建threading.Thread的 ...