jquery 选择器 怎样获取class='aaa'的DIV元素

jquery 选择器 怎样获取class='aaa'的DIV元素,第1张

获取class='aaa'的DIV元素:$('aaa')

获取父级元素id为aaa的div元素:$("#aaa>divaaaaaa")

获取父级元素id为bbb自身类为aaaaaa的元素:$("#bbb>aaaaaa")

jQuery 元素选择器:

jQuery 使用 CSS 选择器来选取 HTML 元素。

$("p") :选取 <p> 元素。

$("pintro") :选取所有 class="intro" 的 <p> 元素。

$("p#demo") :选取所有 id="demo" 的 <p> 元素。

扩展资料:

jQuery 属性选择器:

jQuery 使用 XPath 表达式来选择带有给定属性的元素。

$("[href]") 选取所有带有 href 属性的元素。

$("[href='#']") 选取所有带有 href 值等于 "#" 的元素。

$("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。

$("[href$='jpg']") 选取所有 href 值以 "jpg" 结尾的元素。

<ul style="position: relative"> <li></li>

  <li></li>

  <li id="flag"></li>

  <li></li>

</ul>

<script>

  $(function(){

      var flag=$("#flag");

    alert(flagposition()top);//距离UI的上边距 50

    alert(flagposition()top+flagheight());//得到75,需加上自身高度

  });

</script>

可以通过position方法获取。把你的父元素设置position

jQuery 提供了 parent() 方法用以获取当前匹配元素集合中每个元素的父元素,例如:

$("span")parent(); // 获取所有span标签元素的父节点对象集合

$("selected")parent(); // 获取所有class位selected的元素的父节点对象集合

$(spanselected)parent(); // 获取class为selected的span标签元素的父节点对象集合

另外,注意与parents() 方法的区别——parents() 方法获取当前匹配元素集合中每个元素的祖先元素(祖先元素不仅包括父节点,还包括祖父、曾祖父等等)。

jquery中css() 方法可以设置或返回被选元素的一个或多个样式属性,下面的例子将返回首个匹配元素的 background-color 值:

$("p")css("background-color");

父级的同级元素的子标签的css样式如下:

//eq(0)表示选择匹配到多个元素中的第一个

$("target")parent()siblings()eq(0)children()eq(0)

可以使用jQuery的children方法来获取某个元素下的所有子元素。如果给定表示 DOM 元素集合的 jQuery 对象,children() 方法允许我们检索 DOM 树中的这些元素,并用匹配元素构造新的 jQuery 对象。find() 和 children() 方法类似,不过后者只沿着 DOM 树向下遍历单一层级。

工具原料:编辑器、浏览器

1、使用children方法可以获得选择器下的所有子元素,代码实例如下:

<!DOCTYPE html>

<html>

<head>

<script type="text/javascript" src="/jquery/jqueryjs"></script>

<style>

  body { font-size:16px; font-weight:bolder; }

  p { margin:5px 0; }

</style>

</head>

<body>

  <div>

    <span>Hello</span>

    <p class="selected">Hello Again</p>

    <div class="selected">And Again</div>

 

    <p>And One Last Time</p>

  </div>

<script>$("div")children("selected")css("color", "blue");</script>

</body>

</html>

2、运行的结果是找到类名为 "selected" 的所有 div 的子元素,并将其设置为蓝色,结果如下:

<html>

<script src="jquery-141minjs"></script>

<body>

<div><label>dddddd</label><input type="sss" value="sss"/>ddddddddffffff</div>

<body>

<script>

alert($("input")parent()children()text());

</script>

</html>

<!DOCTYPE HTML>

<html lang="en-US">

<head>

<meta charset="UTF-8">

<title>mainhtml</title>

<style type="text/css">

</style>

<script type="text/javascript" src="jquery-180minjs"></script>

<script type="text/javascript">

jQuery (function ($)

    {

    $ ('div')each (function (i, dom)

    {

    $ (this)find ('p')each (function (j, ele)

    {

    $ (this)text ((j + 1) + " " + $ (this)text ());

    });

    });

    });

</script>

</head>

<body>

<div>

<h4>标题标题标题标题</h4>

<p>内容内容内容内容内容内容内容</p>

<p>内容内容内容内容内容内容内容</p>

<p>内容内容内容内容内容内容内容</p>

</div>

<div>

<h4>标题标题标题标题标题</h4>

<p>内容内容内容内容内容内容内容</p>

<p>内容内容内容内容内容内容内容</p>

<p>内容内容内容内容内容内容内容</p>

<p>内容内容内容内容内容内容内容</p>

<p>内容内容内容内容内容内容内容</p>

</div>

 怎么样获取每个p标签相对于自己父级div的序号 就是想输出为

<div>

<h4>标题标题标题</h4>

<p>内容内容内容内容内容内容内容</p>

<p>内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容</p>

</div>

<div>

<h4>标题标题标题标题</h4>

<p>内容内容内容内容内容内容内容</p>

<p>内容内容内容内容内容内容内容</p>

<p>内容内容内容内容内容内容内容</p>

</div>

<div>

<h4>标题标题标题标题标题</h4>

<p>内容内容内容内容内容内容内容</p>

<p>内容内容内容内容内容内容内容</p>

<p>内容内容内容内容内容内容内容</p>

<p>内容内容内容内容内容内容内容</p>

<p>内容内容内容内容内容内容内容</p>

</div>

</body>

</html>

以上就是关于jquery 选择器 怎样获取class='aaa'的DIV元素全部的内容,包括:jquery 选择器 怎样获取class='aaa'的DIV元素、jquery如何获取某个元素距离它父级的偏移量啊、jquery 如何得到父节点对象等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/9594453.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-30
下一篇 2023-04-30

发表评论

登录后才能评论

评论列表(0条)

保存