jQuery|“>”选择器

简介: :表示选取指定元素的直接子元素的所有元素。实例选取 元素的直接子元素的 元素:$("div > span")定义和用法("parent > child") 选择器选取指定元素的直接子元素的所有元素。

:表示选取指定元素的直接子元素的所有元素。

实例

选取 <div> 元素的直接子元素的 <span> 元素:

$("div > span")

定义和用法

("parent > child") 选择器选取指定元素的直接子元素的所有元素。
parent 必需。规定要选取的父元素。
child 必需。规定要选取的直接子元素(属于指定的父元素)。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title></title> 
<script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("div > span").css("background-color","yellow");
});
</script>
</head>
<body>    

<h2> $("div > span") 会选取什么元素?</h2>

<h4>这个 div 元素有两个直接的子元素 p 和 span:</h4>
<div style="border:1px solid black;padding:10px;">
<p>这是一个段落</p>
<span>这是在 span 元素中的文本</span>
</div>

<h4>这个 div 元素只有一个直接子元素 p:</h4>
<div style="border:1px solid black;padding:10px;">
<p>在是一个段落 <span>这个 span
元素在 p 标签里面 </span></p>
</div>

</body>
</html>
image.png
目录
相关文章
N..
|
10月前
|
JavaScript 前端开发 开发者
jQuery选择器
jQuery选择器
N..
64 1
|
5月前
|
JavaScript 前端开发
jQuery 选择器
jQuery 选择器
52 2
|
6月前
|
JavaScript 索引
jQuery 选择器
jQuery 选择器
61 5
|
9月前
|
JavaScript 前端开发
jQuery 选择器
jQuery 选择器
50 0
|
9月前
|
JavaScript 前端开发 索引
jQuery的选择器与自带函数详解
jQuery的选择器与自带函数详解
|
5月前
|
JavaScript 前端开发
jQuery 选择器
jQuery 选择器用于操作 HTML 元素,支持基于 id、类、类型、属性等条件选择元素。它扩展了 CSS 选择器的功能,并使用 $() 符号。例如,$(&quot;p&quot;) 选取所有段落元素,而 $(&quot;button&quot;).click(function(){ $(&quot;p&quot;).hide(); }) 实现点击按钮后隐藏所有段落。
|
6月前
|
JavaScript 前端开发 CDN
jQuery学习记录--jQuery语法,选择器,事件及hide(),show(), toggle()
本文是关于jQuery的学习笔记,涵盖了jQuery的简介、语法、选择器、事件处理以及hide()、show()、toggle()等方法的使用。
jQuery学习记录--jQuery语法,选择器,事件及hide(),show(), toggle()
|
6月前
|
JavaScript
jQuery 选择器
jQuery 选择器
38 3
|
6月前
|
JavaScript 索引
jQuery 选择器
jQuery 选择器
46 1
|
7月前
|
JavaScript 索引
jQuery的选择器有几种?
jQuery的选择器有几种?
52 1