jQuery中prevAll()方法用法实例


Posted in Javascript onJanuary 08, 2015

本文实例讲述了jQuery中prevAll()方法用法。分享给大家供大家参考。具体分析如下:

此方法查找匹配元素集合之前所有的同辈元素。
同辈元素集合可以通过选择器进行筛选。

语法结构:

$("selector").prevAll(expr)

参数列表:

参数 描述
expr 可选。用于过滤的表达式。

实例代码:

实例一:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="https://3water.com/" />

<title>三水点靠木</title>

<style type="text/css">

.father{

  height:200px;

  width:200px;

  border:1px solid blue;

}

</style>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript"> 

$(document).ready(function(){ 

  $(".father div").prevAll().css("color","blue") 

}) 

</script>

</head>

<body>

<div class="father">

  <p>我是p元素</p>

  <span>我是span元素</span>

  <p>我是p元素</p>

  <div>我是div元素</div>

</div>

</body>

</html>

实例二:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="https://3water.com/" />

<title>三水点靠木</title>

<style type="text/css">

.father{

  height:200px;

  width:200px;

  border:1px solid blue;

}

</style>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript"> 

$(document).ready(function(){ 

  $(".father div").prevAll("span").css("color","blue") 

}) 

</script>

</head>

<body>

<div class="father">

  <p>我是p元素</p>

  <span>我是span元素</span>

  <p>我是p元素</p>

  <div>我是div元素</div>

</div>

</body>

</html>

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
js数值和和字符串进行转换时可以对不同进制进行操作
Mar 05 Javascript
一个不错的js html页面倒计时可精确到秒
Oct 22 Javascript
跟我学习javascript的基本类型和引用类型
Nov 16 Javascript
Node.js的项目构建工具Grunt的安装与配置教程
May 12 Javascript
使用bootstrap typeahead插件实现输入框自动补全之问题及解决办法
Jul 07 Javascript
js获取指定字符前/后的字符串简单实例
Oct 27 Javascript
Angularjs实现分页和分页算法的示例代码
Dec 23 Javascript
微信小程序 转发功能的实现
Aug 04 Javascript
通过vue-cli来学习修改Webpack多环境配置和发布问题
Dec 22 Javascript
JS实现的RC4加密算法示例
Aug 16 Javascript
vue实现多个echarts根据屏幕大小变化而变化实例
Jul 19 Javascript
JavaScript小技巧带你提升你的代码技能
Sep 15 Javascript
jQuery中prev()方法用法实例
Jan 08 #Javascript
深入探密Javascript数组方法
Jan 08 #Javascript
用模版生成HTML的的框架jquery.tmpl使用详解
Jan 07 #Javascript
jQuery中parentsUntil()方法用法实例
Jan 07 #Javascript
jQuery中parents()方法用法实例
Jan 07 #Javascript
jQuery中parent()方法用法实例
Jan 07 #Javascript
jQuery中nextUntil()方法用法实例
Jan 07 #Javascript
You might like
「OVERLORD」动画重要删减!雅儿贝德的背叛?至尊猎杀队结成
2020/04/09 日漫
Zend Guard一些常见问题解答
2008/09/11 PHP
PHP线程的内存回收问题
2016/07/08 PHP
在Laravel5.6中使用Swoole的协程数据库查询
2018/06/15 PHP
Laravel 自定命令以及生成文件的例子
2019/10/23 PHP
LBS blog sql注射漏洞[All version]-官方已有补丁
2007/08/26 Javascript
Html5的placeholder属性(IE兼容)实现代码
2014/08/30 Javascript
TypeScript 中接口详解
2015/06/19 Javascript
jquery SweetAlert插件实现响应式提示框
2015/08/18 Javascript
jQuery实现仿新浪微博浮动的消息提示框(可智能定位)
2015/10/10 Javascript
什么是JavaScript注入攻击?
2016/09/14 Javascript
JavaScript数据结构中串的表示与应用实例
2017/04/12 Javascript
Angular中$state.go页面跳转并传递参数的方法
2017/05/09 Javascript
JavaScript两种计时器的实例讲解
2019/01/31 Javascript
Vue 3.0 前瞻Vue Function API新特性体验
2019/08/12 Javascript
[45:14]Optic vs VP 2018国际邀请赛淘汰赛BO3 第二场 8.24
2018/08/25 DOTA
Python MySQL数据库连接池组件pymysqlpool详解
2017/07/07 Python
pandas实现选取特定索引的行
2018/04/20 Python
Django REST framework 分页的实现代码
2019/06/19 Python
应用OpenCV和Python进行SIFT算法的实现详解
2019/08/21 Python
Python类型转换的魔术方法详解
2020/12/23 Python
加拿大时尚少女服装品牌:Garage
2016/10/10 全球购物
匡威荷兰官方网站:Converse荷兰
2018/10/24 全球购物
英国著名的美容护肤和护发产品购物网站:Lookfantastic
2020/11/23 全球购物
Nike瑞士官网:Nike CH
2021/01/18 全球购物
教师自荐书
2013/10/08 职场文书
2014学雷锋活动心得体会
2014/03/10 职场文书
企业党建工作汇报材料
2014/08/19 职场文书
工厂清洁工岗位职责
2015/02/14 职场文书
见习期个人总结
2015/03/05 职场文书
小学公民道德宣传日活动总结
2015/03/23 职场文书
革命电影观后感
2015/06/18 职场文书
如何利用STAR法则制作留学文书?
2019/08/26 职场文书
Mysql - 常用函数 每天积极向上
2021/04/05 MySQL
有趣的二维码:使用MyQR和qrcode来制作二维码
2021/05/10 Python
redis数据结构之压缩列表
2022/03/21 Redis