jQuery类选择器用法实例


Posted in Javascript onDecember 23, 2014

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

类选择的器匹配具有指定类名的所有元素。

例子:

$(".mydiv")

以上代码选取类名为mydiv的所有元素。
注意:在mydiv前面有一点(.)。
实例代码:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

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

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

<style type="text/css"> 

div{ 

  height:150px; 

  width:150px; 

  background-color:green; 

  margin-top:10px; 

} 

</style> 

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

<script type="text/javascript"> 

$(document).ready(function(){ 

  $("button").click(function(){ 

    $(".mydiv").hide(); 

  }) 

}) 

</script> 

</head> 

<body> 

  <div class="mydiv"></div> 

  <div class="anotherdiv"></div> 

  <button>点击隐藏div元素</button> 

</body> 

</html>

以上代码可以将类名为mydiv的div元素隐藏。

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

Javascript 相关文章推荐
学习从实践开始之jQuery插件开发 菜单插件开发
May 03 Javascript
jquery弹出框的用法示例(一)
Aug 26 Javascript
js如何设置在iframe框架中指定div不显示
Dec 04 Javascript
jquery实现滑动特效代码
Aug 10 Javascript
JavaScript比较当前时间是否在指定时间段内的方法
Aug 02 Javascript
微信小程序 框架详解及实例应用
Sep 26 Javascript
bootstrap选项卡使用方法解析
Jan 11 Javascript
js+html5实现页面可刷新的倒计时效果
Jul 15 Javascript
不到200行 JavaScript 代码实现富文本编辑器的方法
Jan 03 Javascript
vue自定义指令的创建和使用方法实例分析
Dec 04 Javascript
js中innerText/textContent和innerHTML与target和currentTarget的区别
Jan 21 Javascript
vue前端和Django后端如何查询一定时间段内的数据
Feb 28 Vue.js
基于JQuery制作可编辑的表格特效
Dec 23 #Javascript
JavaScript调试工具汇总
Dec 23 #Javascript
jQuery制作简洁的多级联动Select下拉框
Dec 23 #Javascript
jQuery元素选择器用法实例
Dec 23 #Javascript
jquery制作漂亮的弹出层提示消息特效
Dec 23 #Javascript
使用jQuery仿苹果官网焦点图特效
Dec 23 #Javascript
jQuery分组选择器用法实例
Dec 23 #Javascript
You might like
PHP中去掉字符串首尾空格的方法
2012/05/19 PHP
修改destoon会员公司的伪静态中的com目录的方法
2014/08/21 PHP
js 对联广告、漂浮广告封装类(IE,FF,Opera,Safari,Chrome
2009/11/26 Javascript
JS判断是否为数字,是否为整数,是否为浮点数的代码
2010/04/24 Javascript
js 数值项目的格式化函数代码
2010/05/14 Javascript
基于Jquery的跨域传输数据(JSONP)
2011/03/10 Javascript
异步动态加载js与css文件的js代码
2013/09/15 Javascript
Bootstrap Table表格一直加载(load)不了数据的快速解决方法
2016/09/17 Javascript
微信公众号 客服接口的开发实例详解
2016/09/28 Javascript
表单input项使用label同时引用Bootstrap库导致input点击效果区增大问题
2016/10/11 Javascript
深入浅析JavaScript中的RegExp对象
2017/09/18 Javascript
分析javascript中9 个常见错误阻碍你进步
2017/09/18 Javascript
详解Webstorm 新建.vue文件支持高亮vue语法和es6语法
2017/10/26 Javascript
vue tab滚动到一定高度,固定在顶部,点击tab切换不同的内容操作
2020/07/22 Javascript
js中实现继承的五种方法
2021/01/25 Javascript
详解Python中的各种函数的使用
2015/05/24 Python
python脚本实现数据导出excel格式的简单方法(推荐)
2016/12/30 Python
Python学习之Anaconda的使用与配置方法
2018/01/04 Python
Request的中断和ErrorHandler实例解析
2018/02/12 Python
高效使用Python字典的清单
2018/04/04 Python
python实现合并多个list及合并多个django QuerySet的方法示例
2019/06/11 Python
Python数据可视化:饼状图的实例讲解
2019/12/07 Python
python爬虫开发之使用Python爬虫库requests多线程抓取猫眼电影TOP100实例
2020/03/10 Python
django执行数据库查询之后实现返回的结果集转json
2020/03/31 Python
Python使用itcaht库实现微信自动收发消息功能
2020/07/13 Python
webView加载html图片遇到的问题解决
2019/10/08 HTML / CSS
Html5踩坑记之mandMobile使用小记
2020/04/02 HTML / CSS
领导证婚人证婚词
2014/01/13 职场文书
支部组织生活会方案
2014/06/10 职场文书
计划生育证明格式及范本
2014/10/09 职场文书
个人借条范本
2015/05/25 职场文书
新郎婚礼致辞
2015/07/27 职场文书
用python实现监控视频人数统计
2021/05/21 Python
python如何利用cv2模块读取显示保存图片
2021/06/04 Python
python实现A*寻路算法
2021/06/13 Python
Vue Mint UI mt-swipe的使用方式
2022/06/05 Vue.js