<!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. python代码的书写要求

    刚刚接触python,python是对缩进要求很严格的语言,对于我这种平时tab,空格乱用的菜鸟来说简直是吃劲苦头阿,经常出现IndentationError.在这里我就结合自己的经历说说书写格式,如 ...

  2. web - float ， 浮动

    浮动 : 使元素脱离文档流,按照指定的方向发生移动,遇到父级边界或者相邻的浮动元素则停下来: 元素被设置浮动属性后,呈现的特征有: 1.多个块可以在一行显示 2.内联元素支持狂傲 3.默认宽度由内容撑 ...

  3. ES6 JavaScript Promise的感性认知

    http://www.zhangxinxu.com/wordpress/2014/02/es6-javascript-promise-感性认知/ 这篇文章讲的很透彻 http://www.zhangx ...

  4. 重构HTML改善web应用设计

    本文从良构,有效性,布局三个角度,结合往日项目开发经历, 整理总结重构HTML改善Web应用设计的几点规则和做法.部分参考自<重构HTML改善Web应用设计>. 重构.什么是重构?为什么要 ...

  5. IIS发布问题-用户 'IIS APPPOOL\DefaultAppPool' 登录失败

    今天新建了一个ASP.NET(Language=C#)网站,配置好数据库后编写了几行代码测试数据库的是否能正常使用. 当运行程序时,第一个页面都没有打开就出现了错误(因为我首页就访问数据库,填充一些D ...

  6. 红豆带你从零学C#系列之：开始C#编程（一）

    让我们开始学习C#编程吧 作者:红豆西米露 交流QQ:937802080 前面的文章里给大家介绍了C#语言的一些基本认识,现在我们来开始做一个小程序吧! 在这里以我们以“控制台应用程序”来作演示. P ...

  7. C++/C# 最基本的Marshal和Ptr

    Vidyo32.VidyoClientInEventLogin Login = new Vidyo32.VidyoClientInEventLogin(); Login.portalUri = thi ...

  8. 计算Date间的分钟数

    SimpleDateFormat simpleDateFormat = new SimpleDateFormat("HH:mm"); Date date_begin = simpl ...

  9. nginx proxy_pass 后面的斜杠

    # add / location /app/ { proxy_pass http://$backend/; } # location /app/ { proxy_pass http://$backen ...

  10. android中ScrollView和GridView/ListView共存时，ScrollView不在顶部的解决方法

    listView.setFocusable(false); gridView.setFocusable(false); 这个必须在代码中写,xml文件中设置不起作用 原文:http://stackov ...