<!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. OS笔记047代理传值和block传值

    在两个不同的控制器之间传递数据,可以使用代理传值或者block传值. 例子是一个简单通讯录. 主界面如下: 添加联系人界面 查看/编辑联系人界面:默认是查看模式,点击编辑后进入编辑模式 编辑模式 数据 ...

  2. matlab GUI之常用对话框(三)-- dialog \ errordlg \ warndlg \ helpdlg \ msgbox \questdlg

    常用的对话框(三) 1.普通对话框  dialog 调用格式: h=dialog('PropertyName','PropertyValue'......) %普通对话框 h=dialog( ]); ...

  3. headfirst之装饰模式

    class A A.hello class B extends A B.hello = A.hello+B 装饰模式:子类对父类想要包装的方法进行重写,使之成为加强版

  4. jquery ajax 在ie7不能正常使用

    jquery ajax结构不规范到时再ie8以下的用户不能正常使用.比如[1,2,].{1,2,},结构内部的最后不能有“,”.

  5. 详解new/delete(整合)

    C++中内存的动态分配与管理永远是一个让C++开发者头痛的问题,本文通过对C++中内存的动态分配释放的基本原理的介绍,让读者朋友能对C++中的内存的动态分配与释放有较为深入的理解,从而更好驾驭C++程 ...

  6. codeforces 535D. Tavas and Malekas KMP

    题目链接 又复习了一遍kmp....之前都忘光了 #include<bits/stdc++.h> using namespace std; #define pb(x) push_back( ...

  7. discuz门户文章页面模板修改

    修改内容:view.htm 1.文章标题,模板代码 <h1 class="ph">$article[title] <!--{if $article['status ...

  8. Qt在windows与Mac OS中获取执行程序版本号

    1 windows中获取执行文件exe的版本号   QString GetFileVertion(QString aFullName) { QString vRetVersion; string vF ...

  9. [spring+springmvc+mybatis实践]学生社团管理系统

    一.简介 ssm框架为现在十分流行的mvc主流框架.mybatis负责与数据库交互,springmvc与spring完美适配,负责控制器和视图渲染.之前有初步学习过ssm框架,这次借学校里的web课设 ...

  10. 动画画圆的效果特效ios源码

    一款不错的支持动画画圆的效果特效源码,该效果实现了动画画圆,还可以扩展成画其他平面图形功能等,大家可以下载看看吧. //定义所需要画的图形  -(void)intiUIOfView  {      U ...