JavaScript如何向页面中添加一个按钮

 更新时间:2023年10月11日 11:35:57   作者:我是星星bling  
这篇文章主要介绍了JavaScript如何向页面中添加一个按钮,使用两种方式向页面中添加一个按钮,分别是appendChild()和innerHTML属性,本文结合示例代码介绍的非常详细,需要的朋友可以参考下

使用两种方式向页面中添加一个按钮,分别是appendChild()和innerHTML属性

appendChild()

<!DOCTYPE html> 
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <script>
        window.onload = function () 
        {
            var oBtn = document.createElement("input");
            oBtn.id = "btn";
            oBtn.type = "button";
            oBtn.value = "按钮"
            document.body.appendChild(oBtn);
        }
    </script>
</head>
<body>
</body>
</html>

innerHTML属性

<!DOCTYPE html> 
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <script>
        window.onload = function () 
        {
            document.body.innerHTML = '<input id = "btn" type = "button" value = "按钮" />';
        }
    </script>
</head>
<body>
</body>
</html>

两种方式的区别:如果插入的元素比较简单的话,两个方法都可以使用,如果插入的元素比较复杂的话只能用innerHTML属性来实现。

到此这篇关于JavaScript如何向页面中添加一个按钮的文章就介绍到这了,更多相关js页面添加按钮内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

最新评论