<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

        <title>Untitled Document</title>

    </head>

    <script type="text/javascript">

     window.onload=function(){

         var ul=document.getElementsByTagName('ul')[0];

         //console.log(ul.nodeName);//UL

         var lis=ul.childNodes;

         for (var i = 0; i < lis.length; i++) {

             console.log('the '+i+'th node is '+lis[i].nodeName);

         }

         //the 0th node is #text

        // the 1th node is LI

        // the 2th node is #text

        // the 3th node is LI

        // the 4th node is #text

        // the 5th node is LI

        // the 6th node is #text

        ul=document.getElementsByTagName('ul')[1];

        lis=ul.childNodes;

        for (var i = 0; i < lis.length; i++) {

            console.log('the '+i+'th node is '+lis[i].nodeName);

        }

        // the 0th node is LI

        // the 1th node is LI

        // the 2th node is LI

        //很明显 回车也会被认为是一个Node

        //所以应该这么处理

        ul=document.getElementsByTagName('ul')[0];

        lis=ul.childNodes;

        for (var i = 0; i < lis.length; i++) {

            if(lis[i].nodeType==1){

                console.log('the '+i+'th node is '+lis[i].nodeName);

            }

        }

        // the 1th node is LI

        // the 3th node is LI

        // the 5th node is LI 

     }

    </script>

    <body>

        <ul>

            <li>li1</li>

            <li>li2</li>

            <li>li3</li>

        </ul>

        <ul><li>li1</li><li>li2</li><li>li3</li></ul>

    </body>

</html>

javascript Node操作的更多相关文章

  1. javascript DOM 操作

    在javascript中,经常会需要操作DOM操作,在此记录一下学习到DOM操作的知识. 一.JavaScript DOM 操作 1.1.DOM概念 DOM :Document Object Mode ...

  2. JavaScript 节点操作Dom属性和方法(转)

    JavaScript 节点操作Dom属性和方法   一些常用的dom属性和方法,列出来作为手册用. 属性:   1.Attributes 存储节点的属性列表(只读)   2.childNodes 存储 ...

  3. Node操作MongoDB并与express结合实现图书管理系统

    Node操作MongoDB数据库 原文链接:http://www.xingxin.me/ Web应用离不开数据库的操作,我们将陆续了解Node操作MongoDB与MySQL这是两个具有代表性的数据库, ...

  4. javascript DOM 操作基础知识小结

    经常用到javascript对dom,喜欢这方便的朋友也很多,要想更好的对dom进行操作,这些基础一定要知道的.   DOM添加元素,使用节点属性  <!DOCTYPE html PUBLIC ...

  5. Redis的C++与JavaScript访问操作

    上篇简单介绍了Redis及其安装部署,这篇记录一下如何用C++语言和JavaScript语言访问操作Redis 1. Redis的接口访问方式(通用接口或者语言接口) 很多语言都包含Redis支持,R ...

  6. javascript DOM 操作 attribute 和 property 的区别

    javascript DOM 操作 attribute 和 property 的区别 在做 URLRedirector 扩展时,注意到在使用 jquery 操作 checkbox 是否勾选时,用 at ...

  7. select元素javascript常用操作 转

    /*------------------------------------------------------ *作者:xieyu @ 2007-08-14 *语言:JavaScript *说明:s ...

  8. javascript DOM操作之 querySelector,querySelectorAll

    javascript DOM操作之 querySelector,querySelectorAll

  9. JavaScript动态操作style

    1.易错:修改元素的样式不是设置class属性,而是className属性.class是JS的一个保留关键字. 2.易错:单独修改样式的属性使用"style.属性名"3.注意在cs ...

随机推荐

  1. eclipse 修改编码

    在Eclipse的开发使用中,我们经常使用的是UTF-8,但是刚刚安装的或者是导入的项目是其他编码的默认是GBK的,这就造成我们的项目乱码,一些中文解析无法查看,对我们的开发造成不便. 工具/原料 E ...

  2. <转>ASP.NET学习笔记之在ASP.NET MVC中使用DropDownList

    看到一篇关于dropdownlist的用法很好的阐述,比较清楚,留着,防止以后自己不记得,还可以瞅瞅. 在ASP.NET MVC中,尽管我们可以直接在页面中编写HTML控件,并绑定控件的属性,但更方便 ...

  3. Orcale语句大全

    原文地址:http://www.cnblogs.com/omygod/archive/2007/08/31/876620.html Oracle 语句大全 1. Oracle安装完成后的初始口令?  ...

  4. spring aop简单日志实例

    转载自:http://www.blogjava.net/laoding/articles/242611.html 一直就用spring的IOC,遗憾spring的另一重要组成部分AOP却没用过,所以近 ...

  5. oracle习题SQL语句练习

    表(一)Student (学生表) 属性名 数据类型 可否为空 含 义 Sno Varchar2(3) 否 学号(主码) Sname Varchar2(8) 否 学生姓名 Ssex Varchar2( ...

  6. Java socket字节流传输的示例

    服务端server端: package com.yuan.socket; import java.io.*; import java.net.ServerSocket; import java.net ...

  7. 根据用户的ID查用户的名字

    awk -F: '{if($3==0){print $1}}'  /etc/passwd

  8. 5.7.2.4 random() 方法

    Math.random()方法返回大于等于0小于1的一个随机数.对于某些站点来说,这个方法非常实用,因为可以利用它来随机显示一些名人名言和新闻事件.套用下面的公式,就可以利用Math.random() ...

  9. jquery实现锚点动画效果

    锚点相信大家都使用过吧!点击后僵硬的切换是不是很不爽呢? 下面分享一个小技巧,根据锚点offset值来实现动画切换 <!DOCTYPE html PUBLIC "-//W3C//DTD ...

  10. hdu 3530 Subsequence 单调队列

    题目链接 题目给出n个数, 一个下界m, 一个上界k, 让你求出最长的一段序列, 满足这段序列中的最大的数-最小的数<=k&&>=m, 输出这段长度. 可以维护两个队列, ...