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 相关文章推荐
详解强大的jQuery选择器之基本选择器、层次选择器
Feb 07 Javascript
jsp+javascript打造级连菜单的实例代码
Jun 14 Javascript
jQuery选择器querySelector的使用指南
Jan 23 Javascript
JavaScript中eval()函数用法详解
Dec 14 Javascript
解析Javascript单例模式概念与实例
Dec 05 Javascript
Javascript Function.prototype.bind详细分析
Dec 29 Javascript
require.js中的define函数详解
Jul 10 Javascript
深入理解vue-router之keep-alive
Aug 31 Javascript
微信小程序搭建(mpvue+mpvue-weui+fly.js)的详细步骤
Sep 18 Javascript
element-ui 的el-button组件中添加自定义颜色和图标的实现方法
Oct 26 Javascript
详解微信小程序之一键复制到剪切板
Apr 24 Javascript
详解基于element的区间选择组件校验(交易金额)
Jan 07 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
PHP中创建并处理图象
2006/10/09 PHP
php获取某个目录大小的代码
2008/09/10 PHP
php中利用str_pad函数生成数字递增形式的产品编号
2013/09/30 PHP
thinkphp普通查询与表达式查询实例分析
2014/11/24 PHP
php实现URL加密解密的方法
2016/11/17 PHP
浅谈ThinkPHP5.0版本和ThinkPHP3.2版本的区别
2017/06/17 PHP
php ZipArchive实现多文件打包下载实例
2019/10/31 PHP
jQuery Easyui datagrid行内实现【添加】、【编辑】、【上移】、【下移】
2016/12/19 Javascript
ES6字符串模板,剩余参数,默认参数功能与用法示例
2017/04/06 Javascript
JavaScript实现的数字与字符串转换功能示例
2017/08/23 Javascript
浅谈vue项目如何打包扔向服务器
2018/05/08 Javascript
结合Vue控制字符和字节的显示个数的示例
2018/05/17 Javascript
JS跨域请求的问题解析
2018/12/03 Javascript
JavaScript在web自动化测试中的作用示例详解
2019/08/25 Javascript
在LayUI图片上传中,解决由跨域问题引起的请求接口错误的方法
2019/09/24 Javascript
vue项目中极验验证的使用代码示例
2019/12/03 Javascript
JavaScript实现tab栏切换效果
2020/03/16 Javascript
JS Generator 函数的含义与用法实例总结
2020/04/08 Javascript
node.js如何根据URL返回指定的图片详解
2020/10/21 Javascript
更改Python的pip install 默认安装依赖路径方法详解
2018/10/27 Python
Pandas之Dropna滤除缺失数据的实现方法
2019/06/25 Python
Python sklearn中的.fit与.predict的用法说明
2020/06/28 Python
HTML5适合的情人节礼物有纪念日期功能
2021/01/25 HTML / CSS
全球独特生活方式产品和礼品购物网站:AHAlife
2018/09/18 全球购物
Annoushka英国官网:英国奢侈珠宝品牌
2018/10/20 全球购物
Allsole美国/加拿大:英国一家专门出售品牌鞋子的网站
2018/10/21 全球购物
什么是Deployment descriptors;都有什么类型的部署描述符
2015/07/28 面试题
用C语言实现文件读写操作
2013/10/27 面试题
SOA的常见陷阱或者误解是什么
2014/10/05 面试题
学院书画协会部门职责
2013/11/28 职场文书
大学毕业后的十年规划
2014/01/07 职场文书
2014年会策划方案
2014/05/11 职场文书
2014年个人售房协议书
2014/10/30 职场文书
2014年度个人工作总结范文
2015/03/09 职场文书
小型婚礼主持词
2015/06/30 职场文书
react如何快速设置文件路径别名
2021/04/28 Javascript