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页面添加按钮内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
相关文章
深入浅出webpack教程系列_安装与基本打包用法和命令参数详解
下面小编就为大家带来一篇深入浅出webpack教程系列_安装与基本打包用法和命令参数详解。小编觉得挺不错的,现在就想给大家,也给大家做个参考。一起跟随小编过来看看吧2017-09-09JavaScript子类用Object.getPrototypeOf去调用父类方法解析
这篇文章主要介绍了JavaScript子类用Object.getPrototypeOf去调用父类方法。需要的朋友可以过来参考下,希望对大家有所帮助2013-12-12javascript中onmouse事件在div中失效问题的解决方法
我们预期只有当鼠标从div中移开的时候才会触发onmouseout事件,可事实上,当我们移到div中的元素时,例如:本例中的a标签时,就会触发 onmousout事件2012-01-01
最新评论