<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>dom节点</title>
<script type="text/javascript">
window.onload = function(){
    var oUl = document.getElementsByTagName('ul')[0];
    // alert(oUl.childNodes.length)    // 7
    // alert(oUl.children.length)// 3  children 实际上是指的元素节点
    var oLi = document.getElementById('two');
    alert(oLi.parentNode)  
    // nodeType 1是指元素节点  3是指文本节点；
    alert(oLi.parentNode.nodeType) //1
    alert(oUl.firstChild.nodeType) //3
    alert(oLi.nextSibling.nodeType)// 3
    alert(oLi.nextElementSibling.nodeType )//  1 不兼容的情况下可以试试nextElementSibling.nodeType，一般情况下是可以的。  
    
 }
</script>
</head>
<body>
    <ul>
        <li>111111</li>
        <li id="two">46343</li>
        <li>3333</li>
    </ul>
</body>
</html>

dom节点相关问题的更多相关文章

  1. 原生JS中DOM节点相关API合集

    节点属性 Node.nodeName //返回节点名称,只读 Node.nodeType //返回节点类型的常数值,只读 Node.nodeValue //返回Text或Comment节点的文本值,只 ...

  2. DOM 节点的克隆与删除

    无奈的开头 关于DOM节点操作,如果仅仅是根据标准API来操作,那是最简单不过的了.但是现实中却哪有这么容易的问题让我们解决,其实不仅仅是节点的克隆与删除,节点的添加也是如此,而且添加节点需要考虑的情 ...

  3. DOM节点属性

    节点属性 在文档对象模型 (DOM) 中,每个节点都是一个对象.DOM 节点有三个重要的属性 : 1. nodeName : 节点的名称 2. nodeValue :节点的值 3. nodeType ...

  4. js DOM优化相关探索

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

  5. JS 操作Dom节点之样式

    为了提高用户体验,我们经常会动态修改Dom节点的样式,各种浏览器差异比较大,我们如何应对?不断尝试,不断总结~! 1. style.getComputedStyle.currentStyle 内嵌样式 ...

  6. 原生JSdom节点相关（非原创）

    节点属性 Node.nodeName //返回节点名称,只读 Node.nodeType //返回节点类型的常数值,只读 Node.nodeValue //返回Text或Comment节点的文本值,只 ...

  7. 第四章 DOM节点操作

    1.什么是DOM:DOM(document object model)文档对象模型,把每一个元素看做是一个节点,然后对节点进行增删改查的操作 2.DOM的分类:(1)Core Dom:可以对html, ...

  8. HTML DOM节点的增删改查

    上篇博客中,我们已经初步接触了DOM基础,可是我们学习是为了可以更好地应用,今天我们就来看看DOM节点的增删改查. 无论在哪里,我们想要操作一个东西,总是应该先去获得它.那么我们怎么获得呢? HTML ...

  9. DOM节点克隆

    var newDiv = red.cloneNode();document.body.appendChild(newDiv);注意:1.默认只克隆元素本身:设置参数为true,进行深度克隆,可以克隆元 ...

随机推荐

  1. 2019OO第二单元总结

    (1)设计策略 电梯第1次作业是一个傻瓜调度电梯,使用先来先服务原则,不用考虑捎带(可以认为电梯的载客量为1),因此比较简单,调度器用一个队列就可以. 使用生产者-消费者模型,输入线程是生产者,电梯是 ...

  2. 马拉车算法,mannacher查找最长回文子串

    作用: 在线性时间内找到一个字符串的最大回文子串 原理: 奇偶变换:为处理字符串方便,现将给定的任意字符串进行处理,使所有可能的奇数/偶数长度的回文子串都转换成了奇数长度. 具体就是在每个字符的两边都 ...

  3. JavaScript 弹出窗体

    //弹出层 //父页面代码.打开弹窗 function ProDBDisp(link) { var url = _spPageContextInfo.webAbsoluteUrl + link; va ...

  4. oracle树形结构全路径查询

    很实用的语法,父子节点通过id与patientId来关联,知道子节点的id,想查出所有的父节点: START WITH ...CONNECT BY ... SELECT T2.ORG_FULLNAME ...

  5. 解决webpack打包报错： Cannot find module '@webassemblyjs/wasm-parser'

    出现这个错误时,百度和谷歌中都搜索不出个所以然出来,后来看了一下webpack官网,说建议安装node最新版本: 前提条件 在开始之前,请确保安装了 Node.js 的最新版本.使用 Node.js ...

  6. C# .net 语言加密方案

    C# .net 语言加密方案 方案背景 当前C# .net语言的应用范围越来越广泛,IIS 的服务器架构后台代码.桌面应用程序的 winform .Unity3d 的逻辑脚本都在使用.C# .net ...

  7. webpack(7)-生产环境

    development(开发环境) 和 production(生产环境) 这两个环境下的构建目标存在着巨大差异.在开发环境中,我们需要:强大的 source map 和一个有着 live reload ...

  8. 【Idea】-NO.163.Idea.2 -【How to show the horizontal scroll？】

    Style:Mac Series:Java Since:2018-09-10 End:2018-09-10 Total Hours:1 Degree Of Diffculty:5 Degree Of ...

  9. HTTP权威指南_Note

    Chapter 1 HTTP概述 1. Web客户端和Web服务器 web服务器即为HTTP服务器 Web浏览器属于客户端 Web浏览器向服务器请求HTTP对象 2. 资源 Web服务器是Web资源的 ...

  10. windows下gitbash中使用zip命令

    参考: https://ranxing.wordpress.com/2016/12/13/add-zip-into-git-bash-on-windows/