jQuery 判断页面某 ID 元素的个数

场景一

单纯的判断某个元素是否存在可以方便的用以下代码判断：

function IdExists(){
  if($("#testId").length>0){
    alert("Element exists！");
  }else{
    alert("Element is not exists！");
  }
}

场景二

但是要判断页面内是否有 ID 相同的元素就不能用上面的方法判断了，如下：

<div id="test"></div>
<div id="test"></div>
<div id="test"></div>

如果用上面的 $("#test").length 来判断的话我们会发现尽管有三个 id 为 test 的 div，但用 $(“#test”).length 得到的结果总是 1；这是因为 W3C 规定单个页面内一个 ID 只能出现一次，所以 $(“#test”) 其实永远都是指的第一个 id 为 test 的元素，后面的是不会被选中的，所以 $(“#test”).length 为 1。

我们可以这样认为：$("#testId").length 的值（一般认为只能为 0 或者 1）不可能大于 1。

如果要判断同一个页面内是否有 id 相同的元素，可以用如下方法：

//$("body #test").length = 3
function IdExistsNum(){
  if($("body #test").length>1){
    alert("ID Repeat Definition！");
  }else{
    alert("ID Unique！");
  }
}

可以这样理解，$("body #test") 是从 body 下找 id 为 test 的元素，自然能把所有的都找出来了。

赏

谢谢你请我吃糖果

支付宝

微信

• 本文作者： Alvin
• 本文链接： https://alvinyw.github.io/2018/01/4/
• 版权声明： 本博客所有文章除特别声明外，均采用 MIT 许可协议。转载请注明出处！