jQuery 常用操作
jQuery操作: 不像dom是通过等号赋值,它是传递参数
$('#tb:checkbox').prop('checked'); 获取值
$('#tb:checkbox').prop('checked', true); 设置值
内置循环,无须再遍历
jQuery方法内置循环:
$('#tb:checkbox').xxxx ,查找到的每一个复选框都会操作。
$('.c1').addClass('hide'); 只要应用了c1样式的标签,再加一个hide标签。
$('#i1').removeClass('hide'); 只要id为i1的标签,样式全删除hide.
当然也有手动循环:each()
$('#tb:checkbox').each(function(k){
k当前索引
this,DOM对象,当前循环的元素 $(this)
})
三元操作
var v = 条件 ? 真值 : 假值 结果赋值给v
jQuery实现全选,反选,取消
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div style="margin: 0 auto;width: 500px;height: 800px;">
<input type="button" value="全选" onclick="checkAll();"/>
<input type="button" value="取消" onclick="cancelAll();"/>
<input type="button" value="反选" onclick="reverseAll();"/>
<table id="tb1" border="1">
<thead>
<tr><th>选择</th><th>IP</th><th>端口</th></tr>
</thead>
<tbody>
<tr><td><input type="checkbox"/></td><td>1.1.1.1</td><td>80</td></tr>
<tr><td><input type="checkbox"/></td><td>1.1.1.1</td><td>80</td></tr>
<tr><td><input type="checkbox"/></td><td>1.1.1.1</td><td>80</td></tr>
<tr><td><input type="checkbox"/></td><td>1.1.1.1</td><td>80</td></tr>
<tr><td><input type="checkbox"/></td><td>1.1.1.1</td><td>80</td></tr>
</tbody>
</table>
</div>
<script src="jquery-3.3.1.js"></script>
<script>
function checkAll() {
$('#tb1 :checkbox').prop("checked",true);
}
function cancelAll() {
$('#tb1 :checkbox').prop("checked",false);
}
function reverseAll() {
$('#tb1 :checkbox').each(function (k) {
//console.log(k); 这里的k,可以是任何字母,代指当前索引
/* dom实现,this是dom对象,用到的方法也Dom自带的。
if (this.checked) {
this.checked=false;
}else{
this.checked=true;
} */
/* jQuery实现,先将this转换成jQuery对象,再调用jQuery的方法。
if ($(this).prop("checked")){
$(this).prop("checked",false);
}else{
$(this).prop("checked",true);
} */
// 三元运算符实现
var v = this.checked? false:true;
this.checked = v;
})
}
</script>
</body>
</html>
jQuery 常用操作的更多相关文章
- JQuery常用操作实现方式
http://www.cnblogs.com/guomingfeng/articles/2038707.html 一个优秀的 JavaScript 框架,一篇 jQuery 常用方法及函数的文章留存备 ...
- jQuery—常用操作
一.jquery各版本变化 1.3:增加live(),为当前和将来增加的元素绑定事件 1.4:增加delegate().undelegate(),替代live(),可以遍历绑定 1.6:2个破坏性变更 ...
- Jquery常用操作:checkbox、select取值,radio、checkbox、select选中及其相关
常用Jquery操作:checkbox取值.select取值.radio选中.checkbox选中.select选中及其相关: 1.影藏页面元素 使用jquery真的很方便,比如要控制div的显示与隐 ...
- jQuery 常用操作(转)
一.书写规则 支持链式操作: 在变量前加"$"符号(var $variable = jQuery 对象): 注:此规定并不是强制要求. 二.寻找元素 选择器 基本选择器 层级选择器 ...
- jQuery常用操作
jQuery jQuery是一个轻量级的JS库,是一个被封装好的JS文件,提供了更为简便的元素操作方式,jQuery封装了DOM. 使用jQuery 引入jQuery文件 <scrtipt sr ...
- 160726、jQuery常用操作
一.简介 定义 jQuery创始人是美国John Resig,是优秀的Javascript框架: jQuery是一个轻量级.快速简洁的javaScript库. jQuery对象 jQuery产 ...
- jQuery常用操作(待续)
1. input清空内容 <1> $("#选择器id").val(""); <2> $("input[name='input框 ...
- jQuery常用操作部分总结
注意:$(“.xxx”) 类,一定要在前面加上点callback为完成后执行的函数名称隐藏显示:hide() show()淡入淡出:fadeIn() fadeOut() fadetoggl ...
- jquery常用操作整理
1.数据中添加或者删除指定元素 var arr=['red','yello','blue']; arr.push('green'); //添加元素 arr = $.grep(arr,functio ...
随机推荐
- ORACLE中使用DBMS_RANDOM去产生随机数
一.生成随机字符串:DBMS_RANDOM.STRING 用法:DBMS_RANDOM.STRING(选项, 返回字符串长度) 选项有如下几种可供选择:1)'u', 'U' - returning s ...
- vue mapbox 地图 demo
执行以下命令: npm install --save mapbox-gl// cnpm install --save mapbox-gl <template> <div style= ...
- 对于maven的一些命令
- VTP管理交换机的VLAN配置
实验要求:将Switch1设置为VTPserver.Switch2设置为VTPtransparent.Swtich3和4设置为VTPclient 拓扑如下: 涉及内容: 1.VTP的创建 2.VTP的 ...
- Java应用集群下的定时任务处理方案(mysql)
Java应用集群下的定时任务处理方案(mysql) 因为自己有csdn和博客园两个博客, 所以两边都会发一下. csdn地址: http://blog.csdn.net/u012881584/ar ...
- 创建一个版本库,把文件夹用Git管理起来
创建一个文件夹,把这个文件夹用Git管理起来,那么这个文件夹的改变都可以被Git跟踪到,当然也可以将Git中的文件还原到某一个时刻. 首先创建一个空的目录,然后将空的目录由Git来管理 1.建立一个文 ...
- [LeetCode&Python] Problem 628. Maximum Product of Three Numbers
Given an integer array, find three numbers whose product is maximum and output the maximum product. ...
- 纯C MD5
尼玛WordPress把格式全搞乱了 md5.h #ifndef __MD5_H__ #define __MD5_H__ #ifndef _CRT_SECURE_NO_WARNINGS #define ...
- 实验吧—安全杂项——WP之 flag.xls
点击链接下载文件,是一个xls文件 打开: 需要密码的 下一步,我将后缀名改为TXT,然后搜素关键词“flag”,一个一个查找就可以发现啦~!!!(这是最简单的一种方法)
- HTML的属性
data-的好处:对dom的一些自定义标识,通过这些标识符可以传递一些信息到相应的事件里:dom.dataset['属性名称'] 将节点变成数组 渐进式渲染:就是加载到哪里就显示到哪里 css和js的 ...