动态方法ByTageName()

最新推荐文章于 2023-05-10 10:25:13 发布

原创最新推荐文章于 2023-05-10 10:25:13 发布 · 560 阅读

0 ·

CC 4.0 BY-SA版权

js 专栏收录该内容

98 篇文章

订阅专栏

本文介绍了如何使用JavaScript进行DOM操作，包括静态方法document.getElementById()和动态方法document.getElementsByTagName()的使用方法。通过实例演示了如何动态地修改页面元素及添加事件监听。

静态方法：document.getElementById（）
动态方法：document.getElementsByTagName（）
在使用TagName时，一定要在后面添加中括号[]例如：

var list = document.getElementsByTagName('ul')[0];
因为获取的ul是一个数组，只取第一个ul，所以中括号里是数字0

动态方法特性

<script>
    window.onload = function(){
        document.title = 123;//更改标题名字，直接修改就可以；
        document.body.innerHTML = '我是修改的body内容';//更改body里的内容，要添加innerHtml才可以修改

        // 动态添加标签，给body中添加input标签
        document.body.innerHTML = '<input type="button" value="按钮1" /><input type="button" value="按钮2" /><input type="button" value="按钮3" />';

        //获取body中的input标签
        var btn = document.getElementsByTagName('input');
        alert(btn.length);//3，查看有几个input标签
        btn[0].onclick = function(){alert(1);}
        btn[1].onclick = function(){alert(2);}
        btn[2].onclick = function(){alert(3);}
    }
</script>