老师的博客地址：https://www.cnblogs.com/yuanchenqi/articles/6070667.html

day44

属性操作：

--------------------------属性

$("").attr();取属性值

$("").removeAttr();

$("").prop();

$("").removeProp();

--------------------------CSS类

$("").addClass(class|fn)

$("").removeClass([class|fn])

--------------------------HTML代码/文本/值

$("").html([val|fn])

$("").text([val|fn])

$("").val([val|fn|arr])

---------------------------

$("").css("color","red")  修改属性值

关于属性操作，固有属性用prop,自定义属性用attr

　Jquery 遍历：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<script src="jquery-3.1.1.js"></script>

<p>000</p>

<p>111</p>

<p>222</p>

<script>

    arr=[11,22,33];

//    方式一

//    $.each(arr,function (x,y) {

//        console.log(x);

//        console.log(y)

//    })

    //方式2

    $("p").each(function () {

        console.log($(this))

    })

</script>

</body>

</html>

　prop 以及each 的实例正反选：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<script src="jquery-3.1.1.js"></script>

     <button onclick="selectall();">全选</button>

     <button onclick="cancel();">取消</button>

     <button onclick="reverse();">反选</button>

     <table border="1">

         <tr>

             <td><input type="checkbox"></td>

             <td>111</td>

         </tr>

         <tr>

             <td><input type="checkbox"></td>

             <td>222</td>

         </tr>

         <tr>

             <td><input type="checkbox"></td>

             <td>333</td>

         </tr>

         <tr>

             <td><input type="checkbox"></td>

             <td>444</td>

         </tr>

     </table>

     <script>

         // 这里我们使用each遍历input标签，因为这个input是html自带元素，$(this)当前遍历对象，所以这里我们用prop方法，我们把checked设置为true

         function selectall() {

             $("input").each(function () {

                 $(this).prop("checked",true)

             })

         }

         function cancel() {

             $("input").each(function () {

                 $(this).prop("checked",false)

             })

         }

         function reverse() {

             $("input").each(function () {

                 if ($(this).prop("checked")){

                     $(this).prop("checked",false)

                 }

                 else {

                     $(this).prop("checked",true)

                 }

             })

         }

     </script>

</body>

</html>

文档处理：

内部插入标签

外部插入标签

替换

删除

复制

前端学习-jQuery-2的更多相关文章

  1. 前端学习——JQuery Ajax使用经验

    0.前言     在项目推进过程中常常使用Ajax,通过Jquery提供的函数能够很方便的使用Ajax,可是在实际使用中也遇到一些问题,比如怎样防止浏览器使用缓存,怎样使用同步方式等.通过博文整理总结 ...

  2. 前端学习-jQuery

    老师博客:https://www.cnblogs.com/yuanchenqi/articles/6070667.html day43,day44 jquery 中文文档:http://jquery. ...

  3. 前端学习——jquery操作例子

    一.jquery和DOM函数的转换 . jquery转换成dom $(] . dom转换成jquery var i1=documen.getElementById('#i1')---------> ...

  4. 前端学习☞jquery

    一 什么是jQuery对象? jQuery 对象就是通过jQuery包装DOM对象后产生的对象.jQuery 对象是 jQuery 独有的. 如果一个对象是 jQuery 对象, 那么它就可以使用 j ...

  5. 前端学习——使用Ajax方式POST JSON数据包

    0.前言     本文解释怎样使用Jquery中的ajax方法传递JSON数据包,传递的方法使用POST(当然PUT又有时也是一个不错的选择).POST JSON数据包相比标准的POST格式可读性更好 ...

  6. jQuery延迟加载(懒加载)插件 – jquery.lazyload.js-Web前端(W3Cways.com) - Web前端学习之路

    Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...

  7. 前端学习之jquery/下

    前端学习之jquery 一 属性操作 html(): console.log($("div").html()); $(".test").html("& ...

  8. 前端学习之jquery

    前端学习之jquery 1.   什么是jQuery对象? jQuery对象就是通过jQuery包装DOM对象后产生的对象.jQuery对象是jQuery独有的.如果一个对象是jQuery对象,那么它 ...

  9. 每天成长一点---WEB前端学习入门笔记

    WEB前端学习入门笔记 从今天开始,本人就要学习WEB前端了. 经过老师的建议,说到他每天都会记录下来新的知识点,每天都是在围绕着这些问题来度过,很有必要每天抽出半个小时来写一个知识总结,及时对一天工 ...

  10. web前端学习部落22群分享给需要前端练手项目

    前端学习还是很有趣的,可以较快的上手然后自己开发一些好玩的项目来练手,网上也可以一抓一大把关于前端开发的小项目,可是还是有新手在学习的时候不知道可以做什么,以及怎么做,因此,就整理了一些前端项目教程, ...

随机推荐

  1. 同一台电脑上个人的github账户如何与公司的gitlab账户共存

    前些天,写了篇博客 开发环境之git:团队协作git工作流与常用命令. 主要是回顾其中的第一小节基本配置. 但是对于很多程序员而言,我们不仅有公司的gitlab账户做公司的业务,也会有自己个人的git ...

  2. raid 搭建

    RAID几种常见的类型 RAID类型 最低磁盘个数 空间利用率 各自的优缺点 级 别 说 明 RAID0 条带卷 2+ 100% 读写速度快,不容错 RAID1 镜像卷 2 50% 读写速度一般,容错 ...

  3. 深入理解原型链（Prototype chain） __proto__

    原型链(Prototype chain) 原型对象也是普通的对象,并且也有可能有自己的原型,如果一个原型对象的原型不为null的话,我们就称之为原型链(prototype chain). A prot ...

  4. 【持久化框架】Mybatis与Hibernate的详细对比（转发）

    前言 这篇博文我们重点分析一下Mybatis与Hibernate的区别,当然在前面的博文中我们已经深入的研究了Mybatis和Hibernate的原理. Mybatis [持久化框架]Mybatis简 ...

  5. [JOISC2014]スタンプラリー

    [JOISC2014]スタンプラリー 题目大意: 有\(n(n\le3000)\)个车站,另有一个起点站和终点站,所有车站排成一条链,相邻两个车站之间的距离为\(t\).每个车站都有一个上行站台.一个 ...

  6. mongodb副本集搭建

    1.创建目录 mkdir -p /data/r1  /data/r2  /data/r3 2.启动: bin/mongod --config ../mongod.conf --replSet r1 b ...

  7. JS将日期转为距现在的时间长度

    最近在弄一个回忆网站,其中有个一板块类似于情侣空间的纪念日. 照着弄了个类似的,效果如下: 在处理过程中需要把时间戳转为Date()对象,然后与本地时间相减获得时间差,通过运算转换成对应的年月日时长, ...

  8. C++学习笔记50：队列类模板

    队列是只能向一端添加元素,从另一端删除元素的线性群体 循环队列 在想象中将数组弯曲成环形,元素出队时,后继元素不移动,每当队尾达到数组最后一个元素时,便再回到数组开头. 队列类模板 //Queue.h ...

  9. shiro入门教程

    一.shiro入门 shiro.ini和log4j.properties要放在src下面,lib是和src同级别的,然后lib下面的jar包是必须的,lib下面的jar包需要add path,如果报错 ...

  10. yii2 配合bootstrap添加按钮

    新增一个按钮 1.bootstrap 官网:http://getbootstrap.com/ 2.bootstrap 中文官网:http://v3.bootcss.com/ 在视图文件中: <? ...