jquery中next()是什么意思

jquery中next()是什么意思,第1张

JQUERY里的next()是下一节点的的意思

你的$("p")在HTML里有两个,所以得出来的结果是分别输出两次:

第一个<P> 输出 :<p>Hello Again</p>,

第二个<p>输出 :<div><span>And Again</span></div>

别外next()也可能这样 $("p")next("div"),指<p>的下一个DIV,那么就输出:<div><span>And Again</span></div> ,不过你HTML里有两个<p>那就输出两次这东西了

可以用jquery选择器的:eq选择器或者jquery遍历的eq()方法,下面带那给出ul下第4个li的内容

$("ul li:eq(3)")  // 元素的index位置工0开始计数,所以这里的3实际为第4个元素

$("ul")find("li")eq(3)

示例代码如下

创建Html元素

<div class="box">

<span>点击按钮获取指定位置元素:</span><br>

<div class="content">

<li>梨子</li>

<li>李子</li>

<li>栗子</li>

<li>荔枝</li>

</div>

第&nbsp;<input type="text" name="num">&nbsp;个li元素<input type="button" value="确定">

</div>

设置css样式

divbox{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;}

divbox span{color:#999;font-style:italic;}

divcontent{width:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;}

li{margin:10px 0;}

input[type='text']{width:50px;padding:5px 10px;border:1px solid #ff9966;}

input[type='button']{height:30px;margin:10px;padding:5px 10px;}

编写jquery代码

$(function(){

$("input:button")click(function() {

num = $("input:text[name='num']")val()-1;  // index从0开始计算

str = $("divcontent")find("li")eq(num)text(); // eq()遍历方法

// 或者使用如下:eq()选择器的方法,单数之一要拼接字符串

// str = $("divcontent li:eq("+num+")")text()   // :eq()选择器

alert(str);

})

})

观察效果

一、如果是同级(兄弟元素)的,如:

<ul><li class='a'></li><li class='a'></li></ul>可以

$("a")click(function(){

var a=$(this)index;

//或者

var a=$('a')index(this);

}

二、而对于不同级(非兄弟元素),如:

<div class='a'></div>

<div><div class='a'></div></div>

则只能这样

$("a")click(function(){

var a=$('a')index(this);

}

扩展资料:

注意事项

jQuery 拥有若干进行 CSS *** 作的方法。

1、addClass() - 向被选元素添加一个或多个

2、removeClass() - 从被选元素删除一个或多个类

3、toggleClass() - 对被选元素进行添加/删除类的切换 *** 作

4、css() - 设置或返回样式属性

例如:

important

{

font-weight:bold;

font-size:xx-large;

}

blue

{

color:blue;

}

向不同的元素添加 class 属性。当然,在添加类时,也可以选取多个元素:

实例:

$("button")click(function(){

$("h1,h2,p")addClass("blue");

$("div")addClass("important");

});

可根据以下步骤 *** 作:

1、在html里嵌套几个div盒子,然后给盒子一些不同颜色的样式。

2、给第一个盒子加上hover,然后在第一个hover的基础上用~拼接下一个同级元素,这样当鼠标移入第一个盒子时我们就能实现。

$(this)siblings() //取当前元素之外的同级元素

*** 作后代元素可以这样:

$(this)find("节点/ID/CLASS")

$(this)eq(index)

还有其他,可以参考JQ的选择器

以上就是关于jquery中next()是什么意思全部的内容,包括:jquery中next()是什么意思、jquery 怎样获取某元素以下的第n个元素、jquery 怎么获取当前点击class 是第几个等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

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

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

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

发表评论

登录后才能评论

评论列表(0条)

保存