Jquery-获取同级标签prev,prevAll,next,nextAll

1、next([expr]):

获取指定元素的下一个同级元素(注意是下一个同级元素哦)

参数可有可无,参数设定遵循jquery选择器规则

<!DOCTYPE html>
<html>
<head>
  <script type="text/javascript" src="/jquery/jquery.js"></script>
</head>

<body>
<ul>
   <li>list item 1</li>
   <li>list item 2</li>
   <li class="third-item">list item 3</li>
   <li>list item 4</li>
   <li>list item 5</li>
</ul>

<script>
$(‘li.third-item‘).next().css(‘background-color‘, ‘red‘);
</script>

</body>
</html>

这个例子的结果是,只有list item 4背景色变为红色

2、nextAll([expr]):

获取指定元素后边的所有同级元素

Hello

Hello Again
<div><span>And Again</span></div>
var p_nex = $("p").nextAll();
p_nex.addClass(‘p_next_all‘);

注意看最后一个”<p&gt”标签哦,也被加上了’p_next_all’这个类名哦~~

3、andSelf():

获取指定元素后边的所有同级元素,之后加上指定的元素

我感觉这个函数是最有意思的一个函数了,什么意思?直译过来就是”还有我“,”还有自己”,没错,还有自己。

<p>Hello</p><p>Hello Again</p><div><span>And Again</span></div>
var p_nex = $("p").nextAll().andSelf();
p_nex.addClass(‘p_next_all‘);

注意看第一个“<p>”标签啊,这句话的意思是选择p标签后面的所有同级标签,以及自己。。。

以下这两个不举具体的例子了,实际上就是next()和nextAll()的相反喽

4、prev():获取指定元素的上一个同级元素(是上一个哦)。

5、prevAll():获取指定元素的前边所有的同级元素。

var pageValue = $("#pageValue").val();
    alert("增加或者减少一页"+pageValue);
    var obj = $(".left_div_page_a_HOVER");
    $(obj).toggleClass("left_div_page_a_HOVER");

    if( faZ == 1 ){
        if( pageValue > 1){
            pageValue = pageValue - 1;
            obj.prev("a").toggleClass("left_div_page_a_HOVER");
        }
    }else{
        if( pageValue < 123){
            pageValue = pageValue + 1;
            obj.next("a").toggleClass("left_div_page_a_HOVER");
        }
    }
    $("pageValue").val(pageValue);
时间: 2024-10-08 11:13:40

Jquery-获取同级标签prev,prevAll,next,nextAll的相关文章

JQuery获取对象标签类型

通过JQuery的selector,我们很容易的获取了对象.但是,如果想知道对象类型,进行不同的操作,该如何获取对象标签类型呢? $JQueryObject.prop("tagName"); 或者仅仅是判断类型 $JQueryObject.is("TR");//如果是<tr />返回true,否则返回false. 如果使用原生DOM选择器,还可以这样: document.getElementById("targetId").tagNa

Jquery 获取元素标签名称

Jquery的获取元素标签名称的方法: 1.$( this ).get(0).tagName 2.$( this )[0].tagName 3.$( this ).prop("tagName") 4.$( this ).prop("nodeName") 原文地址:https://www.cnblogs.com/queende7/p/8669051.html

jQuery获取同级元素

next()相邻下一个同级元素 prev()相邻上一个同级元素 siblings()所有同级元素 $("#id").next(); $("#id").prev(); $("#id").siblings();

jquery获取select标签的选中元素

select 标签配合 option 使用,是很好的下拉菜单,获取选中的选项值,可以用 jquery 的 api 简单直接的获取: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> </head> <body> <select id='selection' onclick="clickClick()"> <option&g

jquery获取select标签被选中的值

方案:通过option标签的select属性来获取文本与值 jQuery中获得选中select值 第一种方式$('#adverId option:selected').text();//选中的文本 $('#adverId option:selected') .val();//选中的值 $("#adverId").get(0).selectedIndex;//索引 第二种方式 $("#adverId").find("option:selected"

JS,jQuery获取select标签中选中值的方法

JS方法如下: var obj=document.GetElementById("selectId");//声明一个select框对象 var index=obj.selectedIndex;//获取选中项的索引 var text=obj.options[index].text;//获取选中项的文本 var value=obj.options[index].value;//获取选中项的值 jQuery方法如下 $('#selectId option:selected').text();

jquery 获取 html 标签的 class 值

比如 <div class="home current">home</div> 这个 div 的class 里两个值一个是 home 一个是 current,现在我想要 jquery 只获取其中的一个,通过某种方法只返回 home 或是 class,如何实现? var val=$("div").attr("class");//这里获取class值 var array=val.split(" ");//s

jQuery获取相邻标签的值

<!-- Mazey's jQuery --><script language="javascript" type="text/javascript" src="http://www.mazey.cn/js/plugin/jquery/jquery-2.1.1.min.js"></script><div><p id="1" onclick="findNext(th

关于jQuery获取html标签自定义属性值或data值

//获取属性值<div id="id1" value="优秀" ></div>jQuery取值:$("#id1").attr("value"); //获取自定义属性值<div id="id1" value="123" data_obj="优秀" ></div>jQuery取值:$("#id1").at