gpt4 book ai didi

javascript - 如何在 JavaScript 中动态添加和更改 div?

转载 作者:行者123 更新时间:2023-11-28 09:51:24 25 4
gpt4 key购买 nike

我有以下代码:

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">

function timeMsg()
{
var t=setTimeout("enterquestion()",900000);
}


function enterquestion()
{
document.getElementById("questions").innerHTML += '<p>' + document.getElementById("question").value;


}
</script>
</head>
<body>

<h1>Testing Website</h1>
<p id="questions"></p>

<input type="text" name="question" id="question" />
<button type="button" onclick="timeMsg()">Enter question</button>


</body>
</html>

此代码所做的只是允许用户输入问题,然后在 15 分钟后将该问题添加到问题列表中。

我想要对代码做的就是使它立即将文本“QUESTION RECORDED”放在问题将出现的位置,然后而不是简单地将问题添加到末尾,它应该将“已记录的问题”文本替换为问题。

我不知道如何才能同时输入多个问题。

感谢任何帮助,

谢谢!

最佳答案

当您想要替换元素的全部内容但不想添加或插入子节点时,innerHTML 属性非常方便。为此,使用 createElement 更容易。

以下是一个帮助您入门的示例:

<script>
function addDiv(parent, text) {
var div = document.createElement('div');
div.appendChild(document.createTextNode(text));
parent.appendChild(div);
}
</script>

<form action="serverprocess" onsubmit="return false;">
<input type="text" name="qText" value="Question text">
<button onclick="
addDiv(document.getElementById('container'), this.form.qText.value);
">Add question</button>
</form>
<div id="container"></div>

在上面,如果 javascript 不可用或不活动,则将提交表单并可以在服务器上完成处理。如果可用,那么它将在本地处理并且表单不会提交,尽管提交实际上应该基于成功完成操作。

这个问题留给你自己思考吧。

关于javascript - 如何在 JavaScript 中动态添加和更改 div?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10890000/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com