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实现三层遍历删除功能代码
Apr 23 Javascript
45个JavaScript编程注意事项、技巧大全
Feb 11 Javascript
js实现鼠标触发图片抖动效果的方法
Feb 27 Javascript
JavaScript实现动画打开半透明提示层的方法
Apr 21 Javascript
AngularJS入门教程之更多模板详解
Aug 19 Javascript
Angularjs的Controller间通信机制实例分析
Nov 07 Javascript
微信小程序 实战程序简易新闻的制作
Jan 09 Javascript
纯jQuery实现前端分页功能
Mar 23 jQuery
JavaScript设计模式之代理模式详解
Jun 09 Javascript
安装vue-cli报错 -4058 的解决方法
Oct 19 Javascript
JS代码屏蔽F12,右键,粘贴,复制,剪切,选中,操作实例
Sep 17 Javascript
详解Vue中的MVVM原理和实现方法
Jul 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
php 抽象类的简单应用
2011/09/06 PHP
ThinkPHP3.1新特性之G方法的使用
2014/06/19 PHP
php实时倒计时功能实现方法详解
2017/02/27 PHP
js 字符串转换成数字的三种方法
2013/03/23 Javascript
Jquery:ajax实现翻页无刷新功能代码
2013/08/05 Javascript
一个简单的Node.js异步操作管理器分享
2014/04/29 Javascript
js中取得变量绝对值的方法
2015/01/03 Javascript
Jquery动态添加输入框的方法
2015/05/29 Javascript
JS实现灵巧的下拉导航效果代码
2015/08/25 Javascript
轻松使用jQuery双向select控件Bootstrap Dual Listbox
2015/12/13 Javascript
Angularjs实现多个页面共享数据的方式
2016/03/29 Javascript
省市区三级联动jquery实现代码
2020/04/15 Javascript
javascript实现将数字转成千分位的方法小结【5种方式】
2016/12/11 Javascript
详解AngularJs ui-router 路由的简单介绍
2017/04/26 Javascript
js 取消页面可以选中文字的功能方法
2018/01/02 Javascript
React中使用UEditor百度富文本的方法
2018/08/22 Javascript
webpack css加载和图片加载的方法示例
2018/09/11 Javascript
Vue-Router基础学习笔记(小结)
2018/10/15 Javascript
Vue函数式组件的应用实例详解
2019/08/30 Javascript
vue-cli4使用全局less文件中的变量配置操作
2020/10/21 Javascript
python 查找文件夹下所有文件 实现代码
2009/07/01 Python
通过Python 获取Android设备信息的轻量级框架
2017/12/18 Python
python学习基础之循环import及import过程
2018/04/22 Python
Python微信操控itchat的方法
2019/05/31 Python
一张图片能隐含千言万语之隐藏你的程序代码
2012/12/13 HTML / CSS
canvas实现手机的手势解锁的步骤详细
2020/03/16 HTML / CSS
复古斯堪的纳维亚儿童服装:Baby go Retro
2017/09/09 全球购物
会计找工作求职信范文
2013/12/09 职场文书
电气个人求职信范文
2014/02/04 职场文书
教师职称自我鉴定
2014/02/12 职场文书
离婚协议书范本样本
2014/08/19 职场文书
党员干部反四风对照检查材料思想汇报
2014/09/14 职场文书
2015年科室工作总结
2015/04/10 职场文书
MySQL索引是啥?不懂就问
2021/07/21 MySQL
默认网关不可用修复后过一会又不好使了解决方法
2022/04/08 数码科技
GO语言字符串处理函数之处理Strings包
2022/04/14 Golang