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 常用操作的更多相关文章

  1. JQuery常用操作实现方式

    http://www.cnblogs.com/guomingfeng/articles/2038707.html 一个优秀的 JavaScript 框架,一篇 jQuery 常用方法及函数的文章留存备 ...

  2. jQuery—常用操作

    一.jquery各版本变化 1.3:增加live(),为当前和将来增加的元素绑定事件 1.4:增加delegate().undelegate(),替代live(),可以遍历绑定 1.6:2个破坏性变更 ...

  3. Jquery常用操作：checkbox、select取值，radio、checkbox、select选中及其相关

    常用Jquery操作:checkbox取值.select取值.radio选中.checkbox选中.select选中及其相关: 1.影藏页面元素 使用jquery真的很方便,比如要控制div的显示与隐 ...

  4. jQuery 常用操作（转）

    一.书写规则 支持链式操作: 在变量前加"$"符号(var $variable = jQuery 对象): 注:此规定并不是强制要求. 二.寻找元素 选择器 基本选择器 层级选择器 ...

  5. jQuery常用操作

    jQuery jQuery是一个轻量级的JS库,是一个被封装好的JS文件,提供了更为简便的元素操作方式,jQuery封装了DOM. 使用jQuery 引入jQuery文件 <scrtipt sr ...

  6. 160726、jQuery常用操作

    一.简介   定义  jQuery创始人是美国John Resig,是优秀的Javascript框架: jQuery是一个轻量级.快速简洁的javaScript库. jQuery对象  jQuery产 ...

  7. jQuery常用操作(待续)

    1. input清空内容 <1> $("#选择器id").val(""); <2> $("input[name='input框 ...

  8. jQuery常用操作部分总结

    注意:$(“.xxx”)   类,一定要在前面加上点callback为完成后执行的函数名称隐藏显示:hide()   show()淡入淡出:fadeIn()  fadeOut()  fadetoggl ...

  9. jquery常用操作整理

    1.数据中添加或者删除指定元素 var  arr=['red','yello','blue']; arr.push('green');  //添加元素 arr = $.grep(arr,functio ...

随机推荐

  1. log4j下载地址及日志文件输入位置配置

    ERROR StatusLogger Log4j2 could not find a logging implementation. Please add log4j-core to the clas ...

  2. HDU 1251 统计难题（字典树 裸题 链表做法）

    Problem Description Ignatius最近遇到一个难题,老师交给他很多单词(只有小写字母组成,不会有重复的单词出现),现在老师要他统计出以某个字符串为前缀的单词数量(单词本身也是自己 ...

  3. 2016 多校联赛7 Elegant Construction

    Being an ACMer requires knowledge in many fields, because problems in this contest may use physics, ...

  4. Java 容器的使用及数组、List、Set 的相互转换

    0. Utils 字符串数组的排序: Set<String> set = new TreeSet<String>(); Collections.addAll(set, args ...

  5. busybox devmem 直接获取、修改内存信息

    /********************************************************************** * busybox devmem 直接获取.修改内存信息 ...

  6. 九度OJ1020-最小正方形-判大小

    题目1020:最小长方形 时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:7410 解决:3521 题目描述:     给定一系列2维平面点的坐标(x, y),其中x和y均为整数,要求用一个 ...

  7. [LeetCode&Python] Problem 122. Best Time to Buy and Sell Stock II

    Say you have an array for which the ith element is the price of a given stock on day i. Design an al ...

  8. P2467 [SDOI2010]地精部落 （dp+组合数）【扩展Lucas好难不会】

    题目链接:传送门 题目: 题目描述 传说很久以前,大地上居住着一种神秘的生物:地精. 地精喜欢住在连绵不绝的山脉中.具体地说,一座长度为N的山脉H可分为从左到右的N段,每段有一个独一无二的高度Hi,其 ...

  9. 2018.4.2 sqlite优化

    一.参数优化. ```PRAGMA foreign_keys=ON;PRAGMA cache_size=8000;PRAGMA synchronous=OFF;PRAGMA temp_store=ME ...

  10. 无用之flask学习

    一.认识flask 1.短小精悍.可扩展性强 的一个web框架 注意:上下文管理机制 2.依赖wsgi:werkzurg from werkzeug.wrappers import Request, ...