代码:

————————————————————————————————

<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操作-引用同级的元素的更多相关文章

  1. DOM操作,控制HTML元素 (原生JS)

    文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法.DOM 将HTML文档呈现为带有元素.属性和文本的树结构(节点树). 先来看看下面代码: 将HTM ...

  2. DOM操作-动态创建网页元素

    动态创建新的DOM元素,是JavaScript操作网页对象模型的重要手段之一 代码: <!DOCTYPE html> <html> <head> <title ...

  3. jQuery使用(四):DOM操作之查找兄弟元素和父级元素

    查找兄弟元素 向下查找兄弟元素 next() nextAll() nextUntil() 向上查找兄弟元素 prev() prevAll() prevUntil() 查找所有兄弟元素 siblings ...

  4. DOM操作-倒排序子元素

    代码: —————————————————————————————— <script type="text/javascript">                // ...

  5. JavaScrip——DOM操作(查找HTML元素/修改元素)

    innerHTML 1.查找元素——document.getElementById("intro") 2.输出查找的结果: (1)var a=document.getElement ...

  6. 实现类数组转化成数组(DOM 操作获得的返回元素值是一个类数组)

    目标 实现类数组转化成数组 实例 链接地址 使用方法 const foo = document.querySelectorAll('.result') //链接地址输入控制台输入这行代码 const ...

  7. DOM操作元素

    DOM 操作元素 JavaScript的DOM操作可以改变网页内容.结构和样式.我们可以利用DOM操作元素来改变元素里面的内容.属性等. DOM操作元素: 一.操作元素:(一)innerText .( ...

  8. jquer 基础篇 dom操作

    DOM操作: 1.新增元素:创建元素:$("HTML")返回的创建成功的新元素新增子元素:元素.append(obj) 在匹配元素的里面新增一个子元素 追加方式 新元素作为最后一个 ...

  9. DOM 操作属性

    DOM操作就是针对对象的操作 先写一个按钮,<input tupe="button" value=""  id="id">  这 ...

随机推荐

  1. Yii2 基于RESTful架构的 advanced版API接口开发 配置、实现、测试【转】

    环境配置: 开启服务器伪静态 本处以apache为例,查看apache的conf目录下httpd.conf,找到下面的代码 LoadModule rewrite_module modules/mod_ ...

  2. Go-利用Map实现类似Python的Set数据结构

    该笔记参考<Go并发编程实战> 首先实现一个自定义的HashSet 利用interface{}作为键,布尔型作为值. package main import ( "bytes&q ...

  3. Linux_Cytoscape

  4. sql 针对多个id或名称的分割和组合

    开发中经常遇到把多个id拼接在一起符号隔开传入数据库,那拆分呢就是个大事 SELECT nPushID INTO #temp FROM Table1 ), nCoulmn) SELECT * FROM ...

  5. mybatis笔记(一)

    mybatis (一)传值 三种方式 1.直接传值void getMessageList(int userId,String userName);mapper.xml 获取 #{0}代表userId ...

  6. js--局部变量

    今天公司一个实习小妹子问我两段JS代码的区别: <script type="text/javascript"> var a = "Hello"; f ...

  7. JavaScript的DOM(文档对象)基础语法总结2

    1.getAttribute()方法,通过元素节点的属性名称获取属性的值. //语法 elementNode.getAttribute(name) //element(元素);Node(节点) //注 ...

  8. 前台图片上传展示JS(单张图片展示)

    <script type="text/javascript">    //下面用于多图片上传预览功能    function setImagePreviews(aval ...

  9. C++/C常量

    简介 1. 易忽略的常量:函数地址(函数名).静态数组的名字.字符串常量的地址. 2. 常量分类:字面常量.符号常量.契约性常量.布尔常量.枚举常量. 常量认知 1. 字面常量 包括:各种进制的数字. ...

  10. ebtables使用

    Targets: (1)ACCEPT : 让帧通过 (2)DROP: 丢弃帧. (3)CONTINUE:让帧继续走下面的规则(rule) (4)RETURN: 停止当前链的过滤规则,进而去走前面链的下 ...