0

0

怎样使用jQuery内类名选择器

php中世界最好的语言

php中世界最好的语言

发布时间:2018-05-30 09:30:52

|

1450人浏览过

|

来源于php中文网

原创

这次给大家带来怎样使用jQuery内类名选择器,使用jQuery内类名选择器的注意事项有哪些,下面就是实战案例,一起来看一下。

一、介绍

类名选择器是通过元素拥有的CSS类的名称查找匹配的DOM元素。

在一个页面中,一个元素可以有多个CSS类,一个CSS类又可以匹配多个元素,如果有元素中有一个匹配的类的名称就可以被类名选择器选取到。

类名选择器很好理解,在大学的时候大部分人一定都选过课,可以把CSS类名理解为课程名称,元素理解成学生,学生可以选择多门课程,而一门课程又可以被多名学生所选择。

CSS类与元素的关系既可以是多对多的关系,也可以是一对多或多对一的关系。简单地说类名选择器就是以元素具有的CSS类名称查找匹配的元素。

类名选择器的使用方法如下:

$(".class");

其中,class为要查询元素所用的CSS类名。

例如,要查询使用CSS类名为word_orange的元素,可以使用下面的jQuery代码:

$("word_orange");

二、应用

在页面中,首先添加两个

标记,并为其中的一个设置css类,然后通过jquery的类名选择器选取设置了css类的

标记,并设置其css样式。

三、代码


注意观察我的样式

我的样式是默认的

四、运行效果

五、运行说明

在上面的代码中,只为其中的一个

标记设置了CSS类名称,但是由于程序中并没有名称为myClass的CSS类,所以这个类是没有任何属性的。

类名选择器将返回一个名为myClass的jQuery包装集,利用css()方法可以为对应的p元素设定CSS属性值,这里将元素的背景颜色设置为深红色,文字颜色设置为白色。

类名选择器也可能会获取一组jQuery包装集,因为多个元素可以拥有同一个CSS样式。

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

网钛淘拍CMS(TaoPaiCMS) V1.60
网钛淘拍CMS(TaoPaiCMS) V1.60

2013年07月06日 V1.60 升级包更新方式:admin文件夹改成你后台目录名,然后补丁包里的所有文件覆盖进去。1.[新增]后台引导页加入非IE浏览器提示,后台部分功能在非IE浏览器下可能没法使用2.[改进]淘客商品管理 首页 列表页 内容页 的下拉项加入颜色来区别不同项3.[改进]后台新增/修改淘客商品,增加淘宝字样的图标和天猫字样图标改成天猫logo图标4.[改进]为统一名称,“分类”改

下载

推荐阅读:

JS里常见内置函数使用详解

如何使用js封装ajax功能函数与用法

相关专题

更多
php源码安装教程大全
php源码安装教程大全

本专题整合了php源码安装教程,阅读专题下面的文章了解更多详细内容。

129

2025.12.31

php网站源码教程大全
php网站源码教程大全

本专题整合了php网站源码相关教程,阅读专题下面的文章了解更多详细内容。

77

2025.12.31

视频文件格式
视频文件格式

本专题整合了视频文件格式相关内容,阅读专题下面的文章了解更多详细内容。

81

2025.12.31

不受国内限制的浏览器大全
不受国内限制的浏览器大全

想找真正自由、无限制的上网体验?本合集精选2025年最开放、隐私强、访问无阻的浏览器App,涵盖Tor、Brave、Via、X浏览器、Mullvad等高自由度工具。支持自定义搜索引擎、广告拦截、隐身模式及全球网站无障碍访问,部分更具备防追踪、去谷歌化、双内核切换等高级功能。无论日常浏览、隐私保护还是突破地域限制,总有一款适合你!

60

2025.12.31

出现404解决方法大全
出现404解决方法大全

本专题整合了404错误解决方法大全,阅读专题下面的文章了解更多详细内容。

444

2025.12.31

html5怎么播放视频
html5怎么播放视频

想让网页流畅播放视频?本合集详解HTML5视频播放核心方法!涵盖<video>标签基础用法、多格式兼容(MP4/WebM/OGV)、自定义播放控件、响应式适配及常见浏览器兼容问题解决方案。无需插件,纯前端实现高清视频嵌入,助你快速打造现代化网页视频体验。

15

2025.12.31

关闭win10系统自动更新教程大全
关闭win10系统自动更新教程大全

本专题整合了关闭win10系统自动更新教程大全,阅读专题下面的文章了解更多详细内容。

12

2025.12.31

阻止电脑自动安装软件教程
阻止电脑自动安装软件教程

本专题整合了阻止电脑自动安装软件教程,阅读专题下面的文章了解更多详细教程。

5

2025.12.31

html5怎么使用
html5怎么使用

想快速上手HTML5开发?本合集为你整理最实用的HTML5使用指南!涵盖HTML5基础语法、主流框架(如Bootstrap、Vue、React)集成方法,以及无需安装、直接在线编辑运行的平台推荐(如CodePen、JSFiddle)。无论你是新手还是进阶开发者,都能轻松掌握HTML5网页制作、响应式布局与交互功能开发,零配置开启高效前端编程之旅!

2

2025.12.31

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
jQuery 教程
jQuery 教程

共42课时 | 3.6万人学习

HTML+CSS基础与实战
HTML+CSS基础与实战

共132课时 | 9.3万人学习

tp6+adminlte搭建通用后台
tp6+adminlte搭建通用后台

共39课时 | 5.7万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号