Javascript 关于 jQuery append() 以及如何检查元素是否已附加
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7951505/
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
About jQuery append() and how to check if an element has been appended
提问by Mellon
I made a very simple button click event handler, I would like to have <p>element be appended when button clicked, you can check my code here:
我制作了一个非常简单的按钮单击事件处理程序，我希望<p>在单击按钮时附加元素，您可以在此处查看我的代码：
<div id="wrapper">
<input id="search_btn" value="Search" type="button">
</div>
$("#search_btn").click(function(){
$("#wrapper").append("<p id='other'>I am here</p>");
});
I have two questionsto ask:
我有两个问题要问：
1,why my .append()does not work as I expected (that's append the <p>element)
1、为什么我的.append()没有按预期工作（即追加<p>元素）
2.in jQuery, how to check if some element is already appended? For example how to check if <p id="other">has already appended in my case?
2.在 jQuery 中，如何检查某个元素是否已经附加？例如如何检查是否<p id="other">已经附加到我的案例中？
-------------------- update -------------------------------------------
- - - - - - - - - - 更新 - - - - - - - - - - - - - - - --------------
Please check my updated code here.
So, only the 2nd question remains...
所以，只有第二个问题仍然存在......
回答by Samuel Liew
You are using mootools and not jQuery.
To check if your element exists
您使用的是 mootools 而不是 jQuery。
检查您的元素是否存在
if($('#other').length > 0)
if($('#other').length > 0)
So if you do not want to append the element twice:
因此，如果您不想将元素附加两次：
$("#search_btn").click(function() {
if($('#other').length == 0) {
$("#wrapper").append("<p id='other'>I am here</p>");
}
});
Or, you can use the .one(function)[doc]:
或者，您可以使用.one(function)[ doc]：
$("#search_btn").one('click', function() {
$("#wrapper").append("<p id='other'>I am here</p>");
});
回答by Jacob Relkin
1) jsFiddle loads in MooTools by default, you need to include jQuery for this to work. There is not a reason in the world why that example wouldn't work. (Assuming that the $is actually mapped to the jQueryobject, that is.)
1) jsFiddle 默认加载在 MooTools 中，您需要包含 jQuery 才能使其工作。世界上没有任何理由为什么这个例子不起作用。（假设$实际上映射到jQuery对象，即。）
2) You can check the nextSiblingof a DOMElement, or use the next()jQuery method, like so:
2) 您可以检查nextSiblinga 的DOMElement，或使用next()jQuery 方法，如下所示：
if(!$('#something').next().length) {
//no next sibling.
}
回答by Marco Johannesen
$("#search_btn").click(function(){
if(($('#other').length) == 0) {
$("#wrapper").append("<p id='other'>I am here</p>");
}
return false
});
Or
或者
var other_appended = false;
$("#search_btn").click(function(){
if(other_appended == false) {
$("#wrapper").append("<p id='other'>I am here</p>");
other_appended = true;
}
return false;
});
回答by Tom
How to check if an element exists:
如何检查元素是否存在：
if($("p#other").length > 0) {
// a p element with id "other" exists
}
else {
// a p element with id "other" does not exist
}
回答by Tom
check if element is already appended:
检查元素是否已附加：
alert($(this).parent().length?'appended':'not appended');
回答by Moin Zaman
Your fiddle is using the moo tools framework. Change it to use the jquery framework on the left and it works. See http://jsfiddle.net/KxGsj/
您的小提琴正在使用 moo 工具框架。将其更改为使用左侧的 jquery 框架，它可以工作。见http://jsfiddle.net/KxGsj/
