jQuery 中如何查找具有特定 id 的 div 是否存在？

我有一个附加一个函数<div>到单击时的元素。该函数获取单击元素的文本并将其分配给名为的变量name。然后将该变量用作<div> id附加元素的。

我需要看看是否<div> id with name在我追加元素之前已经存在，但我不知道如何找到它。

这是我的代码：

$("li.friend").live('click', function() {
  name = $(this).text();

  // if-statement checking for existence of <div> should go here
  // If <div> does not exist, then append element
    $("div#chatbar").append("<div class='labels'><div id='" + name + "' style='display:none;'></div>" + name + "</div>");

  // Else
    alert('this record already exists');
});

这看起来很简单，但我收到了错误“搜索类名时出现意外的文件结尾”。我不知道这意味着什么。

if (document.getElementById(name)) {
  $("div#" + name).css({bottom: '30px'});
} else {
  $("div#page-content div#chatbar").append("<div class='labels'>" + name + "</div><div id='" + name + "'></div>");
}

更重要的是，如果我关闭它，我希望能够删除该元素，然后删除div id [name]从文档中但是.remove()不这样做。

这是代码：

$(".mini-close").live('click', function(){
  $(this).parent().remove();
});

I added .mini-close作为子函数附加到.labels所以有一种方法可以关闭附加的<div>如果需要的话。点击后.mini-close并尝试再次单击相同的名称li.friends它仍然找到div id [name]并返回我的第一部分if陈述。

您可以使用.length http://api.jquery.com/length/在选择器之后查看它是否匹配任何元素，如下所示：

if($("#" + name).length == 0) {
  //it doesn't exist
}

完整版：

$("li.friend").live('click', function(){
  name = $(this).text();
  if($("#" + name).length == 0) {
    $("div#chatbar").append("<div class='labels'><div id='" + name + "' style='display:none;'></div>" + name + "</div>");
  } else {
    alert('this record already exists');
  }
});

或者，这部分的非 jQuery 版本（因为它是一个 ID）：

$("li.friend").live('click', function(){
  name = $(this).text();
  if(document.getElementById(name) == null) {
    $("div#chatbar").append("<div class='labels'><div id='" + name + "' style='display:none;'></div>" + name + "</div>");
  } else {
    alert('this record already exists');
  }
});