<!DOCTYPE html>
<html>
<head>
<title>Business Card</title>
<script type="text/javascript">
window.onload = init;
function init(){
var button = document.getElementById("populateFields");
button.onclick = updateFields;
}
function updateFields(){
document.getElementById("businessCard").innerHTML = "Business Card Info";
document.getElementById("name").innerHTML = "Name";
}
</script>
</head>
<body>
<div id="businessCard">
<div id="name"></div>
</div>
<input type="button" value="populate fields" id="populateFields">
</body>
</html>
我可以看到ID为“ businessCard”的div已通过“名片信息”更新，但是ID为“ name”的div中的div没有得到更新。
innerHTML在外部div上清除您的内部div。在使用innerHTML外部div之前，请保存内部div。
window.onload = init;
function init() {
var button = document.getElementById("populateFields");
button.onclick = updateFields;
}
function updateFields() {
//save inner div
var innerdiv = document.getElementById("name");
innerdiv.innerHTML = "Name";
var outerdiv = document.getElementById("businessCard");
outerdiv.innerHTML = "Business Card Info";
// add inner div back
outerdiv.appendChild(innerdiv);
}<div id="businessCard">sme
<div id="name">fdfdf</div>
</div>
<input type="button" value="populate fields" id="populateFields">本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句