DOM操作-引用同级的元素
代码:
————————————————————————————————
<script type="text/javascript">
//获取同级按钮的value
function getLevelBtnVal(btn){
var p = btn.parentNode; //通过单击按钮获取它的父节点
var children = p.childNodes; //得到父节点的所有子节点
//遍历子节点
for(var i=0; i<children.length; i++){
//判断不是当前节点,但是同类节点的节点
if(children[i] != btn && children[i].nodeType==btn.nodeType){
alert(children[i].value); //提示对方的value值
}
}
}
</script>
————————————————————————————————
<body style="text-align:center">
<p>
<!-- 定义按钮 -->
<input type="button" value="获取同级按钮的value"
onclick="getLevelBtnVal(this);"/>
<input type="button" value="获取同级按钮的value2"
onclick="getLevelBtnVal(this);"/>
<input type="text" value="3" onclick="getLevelBtnVal(this);"/>
</p>
</body>
—————————————————————————————————
DOM操作-引用同级的元素的更多相关文章
- DOM操作,控制HTML元素 (原生JS)
文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法.DOM 将HTML文档呈现为带有元素.属性和文本的树结构(节点树). 先来看看下面代码: 将HTM ...
- DOM操作-动态创建网页元素
动态创建新的DOM元素,是JavaScript操作网页对象模型的重要手段之一 代码: <!DOCTYPE html> <html> <head> <title ...
- jQuery使用(四):DOM操作之查找兄弟元素和父级元素
查找兄弟元素 向下查找兄弟元素 next() nextAll() nextUntil() 向上查找兄弟元素 prev() prevAll() prevUntil() 查找所有兄弟元素 siblings ...
- DOM操作-倒排序子元素
代码: —————————————————————————————— <script type="text/javascript"> // ...
- JavaScrip——DOM操作(查找HTML元素/修改元素)
innerHTML 1.查找元素——document.getElementById("intro") 2.输出查找的结果: (1)var a=document.getElement ...
- 实现类数组转化成数组(DOM 操作获得的返回元素值是一个类数组)
目标 实现类数组转化成数组 实例 链接地址 使用方法 const foo = document.querySelectorAll('.result') //链接地址输入控制台输入这行代码 const ...
- DOM操作元素
DOM 操作元素 JavaScript的DOM操作可以改变网页内容.结构和样式.我们可以利用DOM操作元素来改变元素里面的内容.属性等. DOM操作元素: 一.操作元素:(一)innerText .( ...
- jquer 基础篇 dom操作
DOM操作: 1.新增元素:创建元素:$("HTML")返回的创建成功的新元素新增子元素:元素.append(obj) 在匹配元素的里面新增一个子元素 追加方式 新元素作为最后一个 ...
- DOM 操作属性
DOM操作就是针对对象的操作 先写一个按钮,<input tupe="button" value="" id="id"> 这 ...
随机推荐
- lucene 索引删除
1.IndexWriter和IndexReader都有删除索引的方法:deleteDocuments(); 不建议使用IndexReader删除索引:使用IndexReader进行删除时,必须关闭所有 ...
- Java中泛型的理解
Java中的泛型,本质上来说,就是是参数化类型,就是说所操作的数据类型被指定为一个参数,而不是确定的某种类型.这种数据类型可以用在类.接口和方法创建中.即泛型类.泛型接口.泛型方法.这样说可能不够生动 ...
- CachedRowSet的用法
String sql="select item_code from xt_dictionary_item where type_id='32' and parent_itemid='0' o ...
- SQL多表插入事务处理
新建两个需统一事务处理的数据表 --学生信息表 CREATE TABLE [dbo].[Student]( [Id] [int] NOT NULL, ) NOT NULL, [Age] [int] N ...
- python-cmp()的使用
注意:python3中已经删除了cmp()该函数. cmp(x,y) 比较x与y,当x>y时,返回1: 当x==y时,返回0: 当x<y时,返回-1: >>>cmp(1, ...
- win7远程连接ubuntu14.04.1桌面
sudo apt-get install xdrp sudo apt-get install vnc4server tightserver sudo apt-get install xfce4 ech ...
- 新手购买海外VPS主机需要注意的几个账户安全问题
一般我们用户的项目需要,可能会较多的购买海外的VPS主机项目居多,其实我也比较喜欢国内的阿里云等产品,但是后者需要的一些政策还是比较麻烦, 所以在操作一些调试项目的时候我比较倾向于选择较为便宜的海外V ...
- 淘淘商城_day08_课堂笔记
今日大纲 问题,如何实现商品数据的同步? 学习MQ(消息队列) 搭建RabbitMQ的环境 学习RabbitMQ的队列 学习Spring-Rabbit 使用RabbitMQ完成商品数据的同步 如何实现 ...
- 新项目引入gulp
1:安装npm:官网下载nodejs--https://nodejs.org/en/.进行安装npm;--http://jingyan.baidu.com/article/a17d528506d7f5 ...
- SpringMVC 基于注解的Controller @RequestMapping @RequestParam..
概述 继 Spring 2.0 对 Spring MVC 进行重大升级后,Spring 2.5 又为 Spring MVC 引入了注解驱动功能.现在你无须让 Controller 继承任何接口,无需在 ...