jQuery中:focus选择器用法实例


Posted in Javascript onDecember 30, 2014

本文实例讲述了jQuery中:focus选择器用法。分享给大家供大家参考。具体分析如下:

此选择器能够匹配当前获取焦点的元素。

语法结构:

$(":focus")

:focus选择器一般需要和其他选择器配合使用,例如和类选择器,元素选择器等等。例如:
$("li:focus")

以上代码会匹配获得焦点的li元素。
当然此选择器前面不加任何其他选择器,不过不加指定的选择器,那么默认就是添加了通用选择器(*)。例如:
$(":focus")

以上代码和下面代码等效:
$("*:focus")

实例代码:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

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

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

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

<script type="text/javascript"> 

$(document).ready(function(){ 

  $("li:focus").css("color","red"); 

}) 

</script>

</head>

<body>

<ul>

  <li>div+css专区</li>

  <li>HTML专区</li>

</ul>

</body>

</html>

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

Javascript 相关文章推荐
CSS3,HTML5和jQuery搜索框集锦
Dec 02 Javascript
JQuery ztree带筛选、异步加载实例讲解
Feb 25 Javascript
Bootstrap轮播图的使用和理解4
Dec 14 Javascript
jQuery使用ajax方法解析返回的json数据功能示例
Jan 10 Javascript
详解微信小程序 通过控制CSS实现view隐藏与显示
May 24 Javascript
详解vue 组件之间使用eventbus传值
Oct 25 Javascript
jQuery实现模糊搜索功能的方法分析
Jun 29 jQuery
Jquery的autocomplete插件用法及参数讲解
Mar 12 jQuery
JS计算斐波拉切代码实例
Sep 12 Javascript
JavaScript实现简单计算器功能
Dec 19 Javascript
JavaScript实现横版菜单栏
Mar 17 Javascript
基于better-scroll 实现歌词联动功能的代码
May 07 Javascript
JavaScript中的原型链prototype介绍
Dec 30 #Javascript
jQuery中:not选择器用法实例
Dec 30 #Javascript
JavaScript中使用Object.create()创建对象介绍
Dec 30 #Javascript
JavaScript中对象property的读取和写入方法介绍
Dec 30 #Javascript
jQuery中:last选择器用法实例
Dec 30 #Javascript
JavaScript中对象property的删除方法介绍
Dec 30 #Javascript
JavaScript中检查对象property的存在性方法介绍
Dec 30 #Javascript
You might like
使用 MySQL 开始 PHP 会话
2006/12/21 PHP
用来解析.htpasswd文件的PHP类
2012/09/05 PHP
深入浅析yii2-gii自定义模板的方法
2016/04/26 PHP
Laravel 添加多语言提示信息的方法
2019/09/29 PHP
Highcharts 非常实用的Javascript统计图demo示例
2013/07/03 Javascript
jquery表单验证框架提供的身份证验证方法(示例代码)
2013/12/27 Javascript
教你使用javascript简单写一个页面模板引擎
2015/05/05 Javascript
实例讲解jquery与json的结合
2016/01/07 Javascript
js获取对象、数组的实际长度,元素实际个数的实现代码
2016/06/08 Javascript
关于JS中setTimeout()无法调用带参函数问题的解决方法
2016/06/21 Javascript
yarn与npm的命令行小结
2016/10/20 Javascript
JavaScript自定义浏览器滚动条兼容IE、 火狐和chrome
2017/01/05 Javascript
Vue使用mixins实现压缩图片代码
2018/03/14 Javascript
vue mounted组件的使用
2018/06/18 Javascript
JSON的parse()方法介绍
2019/01/31 Javascript
ES6中new Function()语法及应用实例分析
2020/02/19 Javascript
python实现系统状态监测和故障转移实例方法
2013/11/18 Python
Python实现简单状态框架的方法
2015/03/19 Python
Google开源的Python格式化工具YAPF的安装和使用教程
2016/05/31 Python
python获取当前运行函数名称的方法实例代码
2017/04/06 Python
Python多重继承的方法解析执行顺序实例分析
2018/05/26 Python
python tkinter库实现气泡屏保和锁屏
2019/07/29 Python
Django框架 Pagination分页实现代码实例
2019/09/04 Python
利用Python代码实现一键抠背景功能
2019/12/29 Python
Python中文分词库jieba,pkusegwg性能准确度比较
2020/02/11 Python
4款Python 类型检查工具,你选择哪个呢?
2020/10/30 Python
CSS3 伪类选择器 nth-child()说明
2010/07/10 HTML / CSS
很酷的HTML5电子书翻页动画特效
2016/02/25 HTML / CSS
HTML5 LocalStorage 本地存储刷新值还在
2017/03/10 HTML / CSS
canvas像素点操作之视频绿幕抠图
2018/09/11 HTML / CSS
JD Sports德国官网:英国领先的运动鞋和运动服饰零售商
2018/02/26 全球购物
Manuka Doctor英国官网:真正的麦卢卡蜂蜜和护肤品
2018/10/26 全球购物
希腊香水和化妆品购物网站:Parfimo.gr
2019/10/03 全球购物
《圆的周长》教学反思
2016/02/17 职场文书
Html5页面播放M4a音频文件
2021/03/30 HTML / CSS
Android开发手册Chip监听及ChipGroup监听
2022/06/10 Java/Android