如何在DOM中"刷新"元素？
在DOM中"刷新"元素的意思是更新或重新渲染DOM中的元素。在前端开发中，我们通常使用JavaScript来操作DOM元素。要刷新DOM中的元素，可以使用以下方法：
- 使用
innerHTML属性：
document.getElementById("elementId").innerHTML = "新的内容";- 使用
textContent属性：
document.getElementById("elementId").textContent = "新的内容";- 使用
createElement和appendChild方法：
var newElement = document.createElement("div");
newElement.innerHTML = "新的内容";
document.getElementById("elementId").appendChild(newElement);- 使用
replaceChild方法：
var newElement = document.createElement("div");
newElement.innerHTML = "新的内容";
var oldElement = document.getElementById("elementId");
oldElement.parentNode.replaceChild(newElement, oldElement);- 使用
querySelector和querySelectorAll方法：
// 单个元素
document.querySelector("#elementId").innerHTML = "新的内容";
// 多个元素
var elements = document.querySelectorAll(".className");
elements.forEach(function(element) {
element.innerHTML = "新的内容";
});这些方法可以帮助您在DOM中更新或重新渲染元素。请注意，在操作DOM时，需要注意性能问题，因为频繁地操作DOM可能会导致页面渲染速度变慢。在可能的情况下，使用虚拟DOM（如React库中的虚拟DOM）可以提高性能。
相关·内容
3回答
用文档片段javascript替换元素内容
javascript、replace、documentfragment
我试图用文档片段替换元素的所有内容：
var frag = document.createDocumentFragment()
文档片段正在很好地创建。那里没问题。我给它添加元素很好，也没有问题。我可以使用element.appendChild(frag)追加它。这也挺好的。
我正在尝试创建一个类似jQuery的HTML的“替换”方法。我不担心老浏览器的兼容性。是否有神奇的功能来替换元素的所有内容？
我尝试过element.innerHTML = frag.cloneNode(true) (根据我能找到的每一个‘替换元素内容’wiki )，这是行不通的。它给了我<div>[obje
浏览 1提问于2012-11-09得票数 19
回答已采纳
3回答
按钮的调整出现在等候柜台之后。
javascript、html、css
按钮出现在等待计数器之后，该计数器在加载页时自动出现。
我希望计数器只在按下按钮后才会出现，然后在<a标记中显示要转换为的按钮。
var downloadButton = document.getElementById("download");
var counter = 10;
var newElement = document.createElement("p");
newElement.innerHTML = "You can download the file in 10 seconds.";
var id;
downloadB
浏览 2提问于2022-11-06得票数 0
1回答
RequiredFieldValidator在使用ScriptManager.RegisterStartupScript时不正确地工作
asp.net、scriptmanager、requiredfieldvalidator
当我解雇btn事件的时候。刷新页面和RegisterStartupScript之后，我的asp.net验证器无法正常工作
protected void btnSumbit_Click(object sender, EventArgs e)
{
NotifyShow("example");
}
public void NotifyShow(string msg)
{
string myScript = string.Format("ShowMessages('{0}','{1}');", msg, "type
浏览 3提问于2015-05-24得票数 0
回答已采纳
3回答
我的javascript只有在函数中才能工作。
javascript、html、onclick
我有一些html和javascript，但是javascript只在我把它放在onclick中时执行。我正在尝试创建一个新的列表元素。
剂量工作：
<html>
<head>
<title></title>
<script type="text/javascript">
var newElement = document.createElement("li");
newElement.innerHTML = "hello";
var boo = document.getElementB
浏览 2提问于2014-05-13得票数 2
回答已采纳
1回答
将onclick事件添加到仅处理最后一个元素的新html元素中
javascript、html
问题是，当我在页面底部创建页码按钮时，onclick只对创建的最后一个元素起作用。
以下是页面按钮的样子：
for(var i = 0; i < numberOfPages; i++) {
if(Math.floor((((startIndex + 1) / 10) + 1)) == (i + 1)) {
var newElement = document.createElement("u");
document.getElementById("imagesNav").app
浏览 3提问于2016-06-30得票数 0
回答已采纳
2回答
.innerHTML只更换零件
javascript、php、html
我有一些JavaScript显示视频和倒计时，在计数完成后，它切换到div的内容到一个问题。这是我的密码：
<script type="text/javascript">
var imagediv = document.getElementById("questionarea");
var counter = 15;
var newElement = document.createElement("div");
newElement.inn
浏览 3提问于2015-01-08得票数 0
回答已采纳
3回答
InnerHTML追加而不是替换
javascript、html
我使用这段代码用AJAX请求更新div
var xmlhttp;
if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else { // code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function () {
if (xmlhttp.
浏览 2提问于2013-08-30得票数 11
回答已采纳
6回答
javascript添加而不是替换
javascript、ajax、dom、innerhtml
快速的问题，我知道我们可以更改的内容
<div id="whatEverId">hello one<div>通过使用：
document.getElementById("whatEverId").innerHTML="hello two";
现在，我是否可以通过将内容添加到div中而不是替换它呢？这样我就能
<div id="whatEverId">hello one hello two<div>
(当然使用类似的方法)
浏览 5提问于2011-07-06得票数 32
回答已采纳
1回答
动态插入Div中断KnockoutJS DataBinding
javascript、knockout.js
我已经创建了一个KnockoutJS应用程序，我还必须使用一些第三方的东西。我的第三方材料使用香草Javascript在Knockout呈现的标记中插入div。一旦发生这种情况，Knockout就会停止工作。
下面是一个封装问题的小提琴：
HTML：
<div style="margin-bottom:50px;">
<button onclick='BindVM();' >Bind</button>
<button onclick='ThrowWrench();'>Throw a
浏览 0提问于2015-02-20得票数 0
回答已采纳
2回答
如何向下面提供的newElement.Innerhtml添加样式
javascript、html、css
我想将文本样式添加到下面的javascript中newElement.InnerHTML部件中。javascript中的第5行表示，“您可以在10秒内下载文件”部件。我想要添加样式到这个文本，如使这个文本更大，以及文本的颜色。
(我目前正在尝试WordPress)
我是初学者，需要帮助，谢谢.
Javascript代码-
var downloadButton = document.getElementById("download");
var counter = 10;
var newElement = document.createElement("p")
浏览 3提问于2021-05-20得票数 1
回答已采纳
2回答
单击“下载按钮”启动10秒倒计时
javascript、jquery
我找到了一个执行此函数的示例，但我希望在单击按钮时开始编辑它，而不是在加载文档时进行编辑。
示例：
var downloadButton = document.getElementById("download");
var counter = 10;
var newElement = document.createElement("p");
newElement.innerHTML = "You can download the file in 10 seconds.";
var id;
downloadButton.parentNode.rep
浏览 6提问于2014-06-29得票数 0
回答已采纳
1回答
当浏览器选项卡最小化或在选项卡之间切换时，需要停止计时器倒计时。
javascript、html
这是我写的脚本，当用户切换到不同的选项卡时，我想停止计时器，在访问站点时恢复。有人能帮我解决这个问题吗。当浏览器选项卡焦点或在选项卡之间切换时，需要停止计时器计数，任何人都可以帮助我使用这段代码吗？
<div style="text-align: center;">
<a class="button" href="" id="download">Click To Download</a>
<button class="infoblogger" id="
浏览 4提问于2021-11-25得票数 1
回答已采纳
3回答
在Javascript代码中更改内部文本颜色
javascript
我是JavaScript的新手，我只是复制一个下载按钮计数器的代码。现在我想改变计数器的文本颜色。有人能帮我吗？
码
var downloadButton = document.getElementById("download");
var counter = 30;
var newElement = document.createElement("p");
newElement.innerHTML = "Job Advertisement will be visible after 30 Seconds ";
var id;
downloa
浏览 6提问于2020-07-27得票数 0
3回答
使用面向对象的javascript创建新元素
javascript
我正在学习如何编写面向对象的javascript。我有一个简单的类来创建div元素，但是当我测试代码时，没有创建新的元素。我这样做正确吗？我使用了以下代码：
function elementCreation(elementParent, elementId, elementText) {
this.elementParent = document.getElementsByTagName(elementParent)[0];
this.elementId = elementId;
this.elementHtml = elementText;
this.elem
浏览 0提问于2013-01-03得票数 0
回答已采纳
2回答
使用Java Script将可变数量的答案保存到单个文本框中
javascript、html
我正在学习JS，但我还不熟悉内部工作原理。有人能指出我思想上的错误吗？
基本思想是提出一个复杂的问题，使用JS (到CSV语法)构造答案，并将其提供给文本框。(从这里它将被处理到一个数据库。)示例如下:您有几个孩子？他们的名字和年龄是什么？
也许，第一个按钮生成的新元素没有添加到文档中？如何做到这一点，或者如何解决其中的价值？
在添加新行的情况下，如何使提交到前一行的值保持不变。例如'Jack'和'10'被写到第一行，用户按下“添加新行”，则此信息应留在第一行。
错误的工作示例:如果添加了循环中的代码，保存按钮将停止工作。
<!doctype html&g
浏览 0提问于2012-12-27得票数 2
回答已采纳
3回答
在文本框之前/之后追加div，将其放置在
javascript、html
我有这个密码
ASPX
<asp:TextBox ID="NewComent" TextMode="MultiLine" onkeyup="textEdit(this);" runat="server"></asp:TextBox>
JS
function textEdit(Inputelement) {
var count = Inputelement.value.length;
var newElement = document.getElementById(Inputelement.i
浏览 6提问于2014-08-11得票数 0
回答已采纳
1回答
JavaScript:删除HTML输入组
javascript、html
我在让removeElement函数按预期工作时遇到了一些问题。我希望addElement函数添加一个新的输入组，其中包含一个下拉菜单和一个删除按钮(它确实是这样做的)。Remove按钮应该调用removeElement函数，移除相应的输入组，这是它第一次执行的，但不再执行。
这里是代码：
function addElement(parentId, elementTag, elementId, html) {
// Adds an element to the document
var p = document.getElementById(parentId);
va
浏览 4提问于2017-12-19得票数 0
1回答
检索本地存储中的所有存储值。
javascript、html、local-storage
初级需求
我真正想要实现的是，有一个带有按钮的文本框，用户可以在该文本框中输入值，然后通过不同的localStorage s将这些值保存到key中(以便即使在页面刷新时也可以检索这些值)，并且插入的值也将显示在文本框下。
我为实现这一目标所做的一切：
<div>
<input type="text" name="userInputs" placeholder="Please insert the value" id="idUserInputs">
<button onclick="i
浏览 0提问于2019-08-18得票数 2
回答已采纳
1回答
nextSibling返回空
javascript、jquery、dom、html
当我在元素生成时为元素设置is时，我收到了一个错误，说"this.nextSiblingElement.id是空的“。我承认还需要做些工作。我只是好奇nextSiblingElement的ID作为null返回的原因是什么。我确保在下拉菜单之前生成了前面的元素，并将菜单放在previousChild.appendChild之前。
如果有必要，我可以将代码编辑下来，但我不确定为了使代码有意义，应该显示多少内容。我现只说明有关的功能如下：
//helper function to add elements to the form
function createNewFormElement(i
浏览 1提问于2013-02-13得票数 0
回答已采纳
1回答
如何向JS尚未添加到DOM的html元素添加事件侦听器？
javascript、html、addeventlistener
我已经设置了一个相当简单的应用程序，它有一个任务输入，并将输入的任务添加到任务列表中。
HTML
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Flatiron Task Lister</title>
<link rel="stylesheet" href="./style.css">
</head>
<body>
浏览 3提问于2020-01-24得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储活动推荐
腾讯云开发者
