【Java基础】 JQuery的常用操作
jQuery的常用操作
一、隐藏显示对象
id为test的元素的display修改成了“none”,即隐藏了id为test的元素:
$('#test').css('display','none')
或
$('#test').style.display="none"
我们经常用到的是切换一个元素的隐藏与现实,下面给出代码:
var show = $('#test').css('display');//获取id为test的元素的display的值$('#test').css('display',show =='block'?'none':show);//通过三目运算
二、点击事件 - click() 方法
$("button").click(function(){});
三、操作元素的样式
$("#msg").width("300"); //将id为msg的元素的宽度设为300 $("#msg").height("300"); //将id为msg的元素的高度设为300 $("#msg").css("background"); //返回元素的背景颜色 $("#msg").css("background","#ccc") //设定元素背景为灰色 $("#msg").height(300); $("#msg").width("200"); //设定宽高 $("#msg").css({ color: "red", background: "blue" });//以名值对的形式设定样式 $("#msg").addClass("select"); //为元素增加名称为select的class $("#msg").removeClass("select"); //删除元素名称为select的class $("#msg").toggleClass("select"); //如果存在(不存在)就删除(添加)名称为select的class
四、操作元素的VALUE
$("input").val(); //返回表单输入框的value值 $("input").val("test"); //将表单输入框的value值设为test $("input").val(""); //将表单输入框的value清空
五、集合处理功能
对于jquery返回的集合内容无需我们自己循环遍历并对每个对象分别做处理,jquery已经为我们提供的很方便的方法进行集合的处理。
包括两种形式:
$("p").each(function(i){this.style.color=['#f00','#0f0','#00f'][i]}) //为索引分别为0,1,2的p元素分别设定不同的字体颜色。 $("tr").each(function(i){this.style.backgroundColor=['#ccc','#fff'][i%2]}) //实现表格的隔行换色效果 $("p").click(function(){alert($(this).html())})
//为每个p元素增加了click事件,单击某个p元素则弹出其内容
六、扩展我们需要的功能
扩展自己想要的功能,如扩展输入两个参数,获取它们的最大值和最小值
$.extend({ min: function(a, b){return a < b?a:b; }, max: function(a, b){return a > b?a:b; } }); //为jquery扩展了min,max两个方法 ,通过“$.方法名”调用: alert("a=10,b=20,max="+$.max(10,20)+",min="+$.min(10,20));
七、支持方法的连写
所谓连写,即可以对一个jquery对象连续调用各种不同的方法。
例如:
$("#test").click(function(){alert($(this).html())}) .mouseover(function(){alert('mouse over event')}) .each(function(i){this.style.color=['#f00','#0f0','#00f'][i]});
为元素id为test的添加三个方法,分别是click()、mouseover()、each()
转载于:https://blog.51cto.com/lyhmm/1944476
【Java基础】 JQuery的常用操作相关推荐
- Java中HashMap的常用操作
Java中HashMap的常用操作 HashMap<Integer, Integer> hashMap = new HashMap<>();hashMap.put(5, 2); ...
- 重拾Java基础知识:运算符操作
Java基础知识:运算符操作 前言 优先级 赋值 算术运算符 一元加减运算符 递增和递减 关系运算符 逻辑运算符 短路 位运算符 与(&) 或(|) 异或(^) 反(~) 左移(<< ...
- Java基础之IO流操作
第14章 File类与IO流 主要内容 File类 字节流 字符流 文件流 缓冲流 转换流 数据流 对象流 打印流 Scanner与System与IO流 教学目标 使用File类对象表示文件或目录 能 ...
- Python os和os.path的基础知识与常用操作
目录 1 os与os.path的关系 2 os和os.path的常用属性和方法 2.1 os模块常用属性 2.2 os模块常用方法 2.3 os.path模块常用方法 2.3.1 路径的常用操作 2. ...
- Python基础灬文件常用操作
文件常用操作 文件内建函数和方法 open() :打开文件 read():输入 readline():输入一行 seek():文件内移动 write():输出 close():关闭文件 写文件writ ...
- java基础知识---IO常用基础操作(二)
九. 缓冲流 9.1 概述 缓冲流,也叫高效流,是对4个基本的FileXxx 流的增强,所以也是4个流,按照数据类型分类: 字节缓冲流:BufferedInputStream,BufferedOutp ...
- java基础知识---IO常用基础操作(一)
一. File类 1.1 概述 java.io.File 类是文件和目录路径名的抽象表示,主要用于文件和目录的创建.查找和删除等操作. 1.2 构造方法 public File(String path ...
- Java基础篇:常用类
文章目录 1.字符串相关的类 1.1 String类及常用方法 String的特性 String对象的创建 字符串对象是如何存储的 String使用陷阱 String常用方法 1.2 StringBu ...
- java io流操作_【Java基础】IO流操作
一.IO流概念: 输入输出流,也就是可以用来读写数据,以及上传下载数据. 二.分类: 1.从流的对象来分: 1)高端流:所有程序或者内存中的流都称为高端流. 2)低端流:所有外界设备中的流都是低端 ...
最新文章
- 姿态检测 树莓派_怎样在树莓派上轻松实现深度学习目标检测?
- sublime php 乱码,sublime打开TXT文件乱码的问题
- linux_软件安装策略和升级策略
- 天天沉迷于皇上本宫的都是sb
- 软件包管理 rpm yum apt-get dpkg
- python linux解密zip_Python Linux系统管理之使用Python管理压缩包
- 企业级 Spring Boot 教程 (十四)用restTemplate消费服务
- 进程间通信(IPC)之内存映射mmap和共享内存shm
- Oracle 19c 新特性:自动化索引 Automatic indexing 实践
- azure_Azure Analysis Services中的动态分区(表格)
- CSS + jQuery 实现的超 Sexy 下拉菜单
- Ecipse:calculating requirements and dependencies(长时间阻塞问题)
- 惠普服务器故障代码_hp常见错误代码
- 多个excel工作簿合并_如何使用Excel VBA将多个工作簿的全部工作表合并到一个工作簿中...
- linux在命令行下打开pdf文件
- 不要试图做完人--任正非在华为优秀党员座谈会上的发言
- linux(ubuntu)系统什么叫:桌面管理器,窗口管理器?
- AR涂涂乐⭐八、(add)优化原代码“7”、正方形识别图改为矩形识别图、增加BGM和App 图标
- 利用python计算圆球的体积_python中球体的体积
- Manjaro为包管理器pacman和yaourt\yay 添加多线程下载
热门文章
- oracle临时表空间占用率过高,ORACLE 临时表空间使用率过高的原因及临时解决方案...
- AWS的VPC使用经验(一)
- 《Python Cookbook 3rd》笔记(5.9):读取二进制数据到可变缓冲区中
- 窗口位置按钮取消_VBA002:“宏”的保存位置有哪几种方式?
- Java JUC工具类--Future
- Python学习12 文件的读写
- SDP协议 学习笔记
- IDEA 错误:找不到或无法加载主类
- 阿里云服务器 CentOS 7上-- Docker 安装 网关(API-Getway)--KONG
- 记录 Duplicate spring bean id dubbo