Javascript-dom总结(获取页面控件)

最新推荐文章于 2021-12-06 15:51:35 发布

→→→→

最新推荐文章于 2021-12-06 15:51:35 发布

阅读量1.2k

点赞数 1

分类专栏： JavaScript/JQuery

本文链接：https://blog.csdn.net/zou_yufei/article/details/9942873

版权

JavaScript/JQuery 专栏收录该内容

22 篇文章 1 订阅

订阅专栏

1. 根据id获取控件

document.getElementById('txt2')

2. 根据name获取一组控件(radiobutton)

document.getElementsByName("gender")

3.通过标签获得一组控件

document.getElementsByTagName("input")

4.获取当前源控件(正在操作的控件)

window.event.srcElement

另外，如果控件声明了id属性，那么在js中可以直接通过id来获得该控件。

应用：设置所有button文字“按钮”，当前点击的button显示“别点我”

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type ="text/javascript">
        //初始化所有按钮为“按钮”
        function fun() {
            var btns = document.getElementsByTagName("button");
            for (var i = 0; i < btns.length; i++) {
                btns[i].innerText = "按钮";
                //绑定点击事件
                btns[i].onclick = btnClick;
            }
        }

        //按钮点击事件
        function btnClick() {
            var btns = document.getElementsByTagName("button");
            for (var i = 0; i < btns.length; i++) {
                if (btns[i] == window.event.srcElement) {
                    btns[i].innerText = "别点我";
                } else {
                    btns[i].innerText = "按钮";
                }
            }
        }

    </script>
</head>
<body οnlοad="fun()">
<button></button>
<button></button>
<button></button>
<button></button>
<button></button>
<button></button>
</body>
</html>

→→→→

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Javascript-dom总结(获取页面控件)

1. 根据id获取控件document.getElementById('txt2')2. 根据name获取一组控件(radiobutton)document.getElementsByName("gender") 3.通过标签获得一组控件document.getElementsByTagName("input") 4.获取当前源控件(正在操作的控件)wind
复制链接

扫一扫