首页    技术博客    PHP教程    数据库技术    前端开发   HTML5    Nginx    php论坛
新用户注册 | 会员登录
加入会员，解锁专属内容
取消
热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

JavaScript：获取父节点CSS样式DOM节点(类型、名称、节点值)兄弟节点子节点设置和修改CSS样式

作者：我的爱来了2012_800 | 来源：互联网 | 2023-09-08 18:36
@{Layoutnull;}GainNode


@{
Layout = null;
}








@*获取父节点*@



点击这里获取父节点






@*获取 id="demo" 的节点的所有元素子节点*@


子节点一


子节点二


子节点三






@*获取第一个子节点*@

子节点一

子节点二

子节点三






@*获取第一个子节点修改代码*@

子节点一

子节点二

子节点三






@*获取上一个节点*@

上一个节点

当前节点（点击这里）

下一个节点






@*获取上一个节点修改代码*@

上一个节点

当前节点（当前节点）

下一个节点






@*获取元素节点和文本节点的类型值：*@

点击这里显示节点类型





@*节点名称*@

点击这里显示节点名称





@*获取文本节点的节点值：*@

点击这里显示文本节点的值





@*获取几个典型的元素节点*@

我是
标签

我是

标签


我是
标签






@*计算所有
标签的个数，并显示它的文本：*@

我是第 1 个
标签

我是第 2 个
标签

我是第 3 个
标签

我是第 4 个
标签
我是第 5 个
标签

我是第 6 个
标签



@*设置和修改CSS样式*@




点击这里改变CSS样式

@********************************(1)获取父节点**********************************@

@*******************************************************************************@
@********************************(2)获取子节点**********************************@

@*******************************************************************************@
@********************************(3)获取兄弟节点********************************@

@*******************************************************************************@
@********************************(4)获取节点类型、节点名称、节点值**************@

@*******************************************************************************@
@********************************(5)获取DOM节点*********************************@

@*******************************************************************************@
@********************************(6)设置和修改CSS样式***************************@

@*******************************************************************************@
@*获取父节点*@

@*获取 id="demo" 的节点的所有元素子节点*@

@*获取第一个子节点
在IE8.0及其以下版本的浏览器中，显示：
第一个子节点：[object HTMLDivElement]
第一个子节点的类型是：1
第一个子节点的名称是：DIV
在Chrome、Opera、Safari、FireFox下，显示：
第一个子节点：[object text]
第一个子节点的类型是：3
第一个子节点的名称是：#text*@

@*获取第一个子节点修改代码
在所有浏览器下，显示：
第一个子节点：[object HTMLDivElement]
第一个子节点的类型是：1
第一个子节点的名称是：DIV*@


@*获取上一个节点
在 IE8.0 以下，显示：
上一个节点的类型是：1
上一个节点的名称是：preNode
在Chrome、Opera、Safari、FireFox下，显示：
上一个节点的类型是：3*@

@*获取上一个节点修改代码
在所有浏览器下，显示：
上一个节点的类型是：1
上一个节点的名称是：preNode*@

@*获取元素节点和文本节点的类型值*@

@*获取元素节点名称、文本节点名称和文档节点名称*@

@*获取文本节点的节点值：*@

@*获取几个典型的元素节点*@

@*计算所有
标签的个数，并显示它的文本：*@

@*设置和修改CSS样式*@



 


推荐阅读
author-avatar
我的爱来了2012_800
这个家伙很懒，什么也没留下！
Tags | 热门标签
RankList | 热门文章
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有