多选框动态插入内容到页面去

iteye_8608

于 2007-07-19 12:44:21 发布

阅读量149

点赞数

分类专栏： JavaScript 文章标签： XHTML HTML

JavaScript 专栏收录该内容

10 篇文章

订阅专栏

本文通过一个简单的HTML页面展示了如何使用JavaScript来操作DOM元素，包括根据复选框的状态变化来动态修改页面内容。该示例涉及HTML基本结构、元信息设置及内联脚本的应用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

[code]<!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=utf-8" />
<script>
function qwer(obj){
var obj=document.getElementById(obj);
if(obj.checked){
document.getElementById("div1").innerHTML+="<li id='qwer1' style='border:1px solid #000;'>1111111111111111111111</li>";
document.getElementById("qwer1").innerHTML+="<span id='qwer2' style='border:2px solid #F00;'>2222222222222222222</span>";
}
else{
document.getElementById("qwer1").outerHTML=" ";
alert(document.getElementById("div1").innerHTML);
}
}

</script>
</head>

<body>
<input type="checkbox" name="checkbox" id="checkbox1" value="checkbox" onclick="qwer('checkbox1')" />
<br />
<br /><br /><br /><br /><br />
<ul id="div1">0000000000000000000</ul>
</body>
</html>
[/code]