代码:

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

<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. angular中的jsonp记录

    angular的正常机制采用引入$http服务的形式进行 get post等的访问.但是在跨域访问的时候就需要采用jsonp了. 不废话,直接上示例和引用原文地址: 比如访问地址为 http://ur ...

  2. Hibernate配置详细解释

     hibernate.cfg.xml <!--标准的XML文件的起始行,version='1.0'表明XML的版本,encoding='gb2312'表明XML文件的编码方式--> < ...

  3. 特殊函数(__all__)

    python里__all__ 属性分别于模块和包之中的用法 一. 在模块(*.py)中使用意为导出__all__列表里的类.函数.变量等成员,否则将导出modualA中所有不以下划线开头(私有)的成员 ...

  4. javaWEB总结(15):jsp指令_page指令

    jsp指令 jsp指令是为jsp引擎设计的.他们并不直接产生任何可见输出,而只是告诉引擎如何处理jsp页面的其余部分. 目前定义了page,include和taglib这三种指令. page指令 (1 ...

  5. ACdream 1020 The Game about KILL

    找规律. 11 3 1 3 5 7 1 3 5 7 9 11 13 15 ....... #pragma comment(linker, "/STACK:1024000000,1024000 ...

  6. Node.js:EventEmitter

    概要:本篇博客主要介绍EventEmitter Node.js所有的异步I/O操作在完成时都会发送一个事件到事件队列.事件由EventEmitter对象提供.下面通过一个例子来说明EventEmitt ...

  7. Node.js:常用工具util

    概要:本篇博客的主要内容是介绍node.js的常用工具util. 1.util.inherits util.inherits(constructor,superConstructor)是一个实现对象间 ...

  8. JavaScript事件响应的基础语法总结

    1.onclick是鼠标单击事件,当在网页上单击鼠标时,就会发生该事件.同时onclick事件调用的程序块就会被执行,通常与按钮一起使用 //例子 <html> <head> ...

  9. 有关Flash中与Java调用时候注意的一些事项

    1.构建本地拓展的ActionScript库时候要注意SWF文件的版本兼容性: 参考:http://help.adobe.com/zh_CN/air/extensions/WS99209310cacd ...

  10. (转)eclipse自动补全的设置

    如果你用过Visual Studio的自动补全功能后,再来用eclipse的自动补全功能,相信大家会有些许失望. 但是eclipse其实是非常强大的,eclipse的自动补全没有VS那么好是因为ecl ...