如何通过JS，在html网页上进行添加元素，包括div 以及下拉框等

最新推荐文章于 2023-03-01 22:55:04 发布

ningxiao77

最新推荐文章于 2023-03-01 22:55:04 发布

阅读量2.6k

点赞数 1

分类专栏： HTML JS DIV SELECT 文章标签： HTML JS DIV SELECT

本文链接：https://blog.csdn.net/ningxiao77/article/details/49152303

版权

HTML JS DIV SELECT 专栏收录该内容

0 篇文章 0 订阅

订阅专栏

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>测试文档</title>
<script >
function add()
{
var s=document.getElementById("demo1")

var addDiv = document.createElement('div');
addDiv.innerHTML = '添加的div';
addDiv.id="addDivId"
s.appendChild(addDiv);


var addSELECT= document.createElement('select');
addSELECT.id="addSELECTId";
var addOptions=document.createElement("option");
addOptions.name="uyuyuy"
addOptions.innerHTML="fgfff"
addSELECT.appendChild(addOptions)
s.appendChild(addSELECT);


//删除remove() ----> obj.options.remove(obj.selectedIndex);
//删除所有----> obj.options.length = 0 ; 不是什么removeAll 长度改0就好了
//获取选中value---------> obj.options[obj.selectedIndex].value;
//获取选中text ---------> obj.options[obj.selectedIndex].text;
//修改---------> obj.options[obj.selectedIndex] = new Option("新文本", "值") ;
}
</script>
</head>
<body>

<p id="demo0">
这是第0段
</p>
<p id="demo1">
<div>这是第1段</div>
</p>
<div id="demo2">
<p>这是第2段</p>
</div>
<input type="button" value="按钮" οnclick="add()" />
</body>
</html>