<!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. cesium 飞线 瓣体传感器(雷达扫描) 效果

    参考:github地址 本人新手,npm webpack 这些还是一知半解,只记录自己得到成功结果的操作步骤,可能存在多余或错误的步骤. 1.github 把代码下载下来,解压. 2.webstorm ...

  2. react将字符串转义成html语句

    在使用reactjs库的时候,会遇到将一段html的字符串,然后要将它插入页面中以html的形式展现,然而直接插入的话页面显示的就是这段字符串,而不会进行转义,可以用以下方法插入,便可以html的形式 ...

  3. DDoS攻击及防御措施

    SYN flood 伪造大量的源IP地址,分别向服务器端发送大量的SYN包,此时服务器端会返回SYN/ACK 包,因为伪造的IP并不会答应,服务器端并没有收到伪造的IP的回应,会重试3~5次并等待一个 ...

  4. leetcode 之 two sum （easy）c++

    1.数组的长度 length() .容器vector长度  size() .容器vector vector是C++标准模板库中的部分内容,它是一个多功能的,能够操作多种数据结构和算法的模板类和函数库. ...

  5. LAYUI select 下拉框得高度

    页面下得select 框 在css页面加样式 .layui-form-select dl {    max-height: 152px;}

  6. 常见查找算法（Java代码实现）

    一,顺序查找 查找算法中顺序查找算是最简单的了,无论是有序的还是无序的都可以,只需要一个个对比即可,但其实效率很低.我们来看下代码 public static int search(int[] a, ...

  7. mysql--实现oracle的row_number() over功能

    有时候我们想要得到每个分组的前几条记录,这个时候oracle中row_number函数使用非常方便,但可惜mysql没有.网上搜了些实现方法. 表flow_task有phaseno(序列号),obje ...

  8. 设置js的ctx

    <script type="text/javascript" src="${ctx}/js/dynamic.jsp"></script> ...

  9. 一分钟学会Xmind

  10. mysql执行update语句受影响行数是0

    mybatis连接mysql数据库,发现同一个update执行多次,返回的int值都是1. 我记得同样的update再次执行时 受影响行数是0. 后来发现,我之前一直用的SQLyog是这样子的. 原来 ...