jQuery如何获得同级元素
在使用jQuery时，我们常常需要操作同级的元素，如何获得同级元素呢？下面，我们将介绍几种获得同级元素的方法。
方法一：siblings()
jQuerysiblings()方法能够匹配当前元素的所有同级元素。
在以下示例中，我们使用siblings()方法获得同级元素并进行样式修改：
<!DOCTYPEhtml><html><head><title>jQuery获得同级元素</title><scriptsrc=https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js></script><style>.siblings{font-weight:bold;}</style></head><body><div><p>同级元素1</p><p>同级元素2</p><p>同级元素3</p><p>同级元素4</p></div><script>$(document).ready(function(){$(p).click(function(){$(this).siblings().addClass(siblings);});});</script></body></html>方法二：next()
jQuerynext()方法能够匹配当前元素的下一个同级元素。
在以下示例中，我们使用next()方法获得下一个同级元素进行样式修改：
<!DOCTYPEhtml><html><head><title>jQuery获得同级元素</title><scriptsrc=https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js></script><style>.next{font-weight:bold;}</style></head><body><div><p>元素1</p><p>元素2</p><p>元素3</p><p>元素4</p></div><script>$(document).ready(function(){$(p).click(function(){$(this).next().addClass(next);});});</script></body></html>方法三：prev()
jQueryprev()方法能够匹配当前元素的上一个同级元素。
在以下示例中，我们使用prev()方法获得上一个同级元素进行样式修改：
<!DOCTYPEhtml><html><head><title>jQuery获得同级元素</title><scriptsrc=https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js></script><style>.prev{font-weight:bold;}</style></head><body><div><p>元素1</p><p>元素2</p><p>元素3</p><p>元素4</p></div><script>$(document).ready(function(){$(p).click(function(){$(this).prev().addClass(prev);});});</script></body></html>桂}哥}网}络www.gUIgege.cn
1对1专业客服
24小时服务支持
365天无间断服务
5分钟快速响应TOP
