总有人间一两风,填我十万八千梦

jQuery .has() 用法 手册 | 示例代码

jQuery开发手册 归档 347℃ 0评论

描述: 筛选匹配元素集合中的那些有相匹配的选择器或DOM元素的后代元素。

  • 添加的版本: 1.4.has( selector )

    • selector
      类型: String
      一个用于匹配元素的选择器字符串。
  • 添加的版本: 1.4.has( contained )

    • contained
      类型: Element
      用于匹配元素的DOM元素。

如果提供一个jQuery对象代表DOM元素集合, .has() 方法会用其子集创建一个新的jQuery对象。提供的选择器会一一测试原先那些匹配元素的后代,含有匹配后代的元素会保留在结果中。

下面是一个嵌套列表的页面:

1
2
3
4
5
6
7
8
9
10
11
<ul>
<li>list item 1</li>
<li>list item 2
<ul>
<li>list item 2-a</li>
<li>list item 2-b</li>
</ul>
</li>
<li>list item 3</li>
<li>list item 4</li>
</ul>

我们可以用如下方式对列表项集合应用这个方法:

1
$('li').has('ul').css('background-color', 'red');

结果是 item 2 背景变成了红色,因为只有这个 <li> 含有 <ul> 后代。

例子:

检测是否一个元素在另一个之内。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<!DOCTYPE html>
<html>
<head>
<style>
.full { border: 1px solid red; }
</style>
<script src="https://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<ul><li>Does the UL contain an LI?</li></ul>
<script>
$("ul").append("<li>" + ($("ul").has("li").length ? "Yes" : "No") + "</li>");
$("ul").has("li").addClass("full");
</script>
</body>
</html>

转载请注明:悠然品鉴 » jQuery .has() 用法 手册 | 示例代码

喜欢 (0)or分享 (0)
发表我的评论
取消评论

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址