jQuery 附加错误信息，想先清除div
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/960736/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Appending an error message, want to clear the div first
提问by mrblah
My HTML looks like and js looks like this:
我的 HTML 看起来像 js 看起来像这样：
<div class="container"></div>
var html = "<div class="error">hello</div>";
$(".container").append( $(html) );
Problem is that I don't clear the html inside the div with class=container first, so I keep appending messages to that area.
问题是我没有先用 class=container 清除 div 中的 html，所以我一直在向该区域附加消息。
How can I clear anything inside of the div class="container" first and THEN append my 'html' div?
如何首先清除 div class="container" 中的任何内容，然后附加我的 'html' div？
回答by karim79
Assuming you mean to 'replace' what is in your div, I think what you need to use is:
假设您的意思是“替换”您的 div 中的内容，我认为您需要使用的是：
$(".container").html( html );
A more jQueryish way to do it would be:
一个更jQueryish的方法是：
$errorDiv = $('<div>hello</div>').addClass('error');
$(".container").html($errorDiv.html());
That has the added benefit of giving you a reference to the error div.
这有一个额外的好处，即为您提供对错误 div 的引用。
回答by Adrian Godong
You can call
你可以打电话
$(".container").empty();
before you append the new div element.
在添加新的 div 元素之前。
Reference: http://docs.jquery.com/Manipulation/empty
回答by Tomas Aschan
I take the liberty to assume that you're using the container for status messages, and then creating error/success messages on the fly to go inside the container div. If so, I'd suggest going with the following approach instead:
我冒昧地假设您将容器用于状态消息，然后动态创建错误/成功消息以进入容器 div。如果是这样，我建议改用以下方法：
Html:
网址：
<div id="status"></div>
Javascript:
Javascript：
function showError(msg) {
$('#status').html(msg).addClass('error');
}
function showStatus(msg) {
$('#status').html(msg).removeClass('error');
}
Note the following:
请注意以下事项：
- As Paolo mentions in his comment, it is much more effective to reference the
<div>by anid- that goes directly on the javascriptdocument.getElementById()method, which is way faster than going over the entire DOM tree in search for one element... - As you were clearing the contents of the
<div class="container">for each call, I saw no reason to keep it. You could just as well just manipulate the html contents andthe css classes of a single div. Faster, and looks nicer in your markup =) - You obviously don't need your show status/error message logic in separate methods - I only did so for clarity.
- 正如 Paolo 在他的评论中提到的那样，
<div>通过id直接引用javascriptdocument.getElementById()方法的-引用要有效得多，这比遍历整个 DOM 树以搜索一个元素要快得多...... - 当您
<div class="container">为每次调用清除内容时，我认为没有理由保留它。您也可以只操作单个 div的 html 内容和css 类。更快，并且在您的标记中看起来更好 =) - 您显然不需要在单独的方法中显示状态/错误消息逻辑 - 我这样做只是为了清楚起见。
回答by Ali
this is how I went about it
这就是我的做法
$(document).ready(function() {
$('.err').click(function() {
$('.err').empty().text('Massive Error has occured. ooof!!!');
});
});
回答by Ali
Yes you are right. I meant to say that for append method.
你是对的。我的意思是说对于 append 方法。
so:
所以：
$(".container").empty().append(htmlOfyourerror);
