jQuery学习
关注
分享
扫一扫
jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。
End_less__
不做点什么，怎么能展现自己
展开
-
Mr.J-- jQuery学习笔记(一)--初入jQuery
jQuery是什么 jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、...原创 2019-06-03 22:46:06 · 1102 阅读 · 0 评论 -
jQuery--noConflict()方法
$ 符号如果其他 JavaScript 框架也使用 $ 符号作为简写怎么办？其他一些 JavaScript 框架包括：MooTools、Backbone、Sammy、Cappuccino、Knockout、JavaScript MVC、Google Web Toolkit、Google Closure、Ember、Batman 以及 Ext JS。其中某些框架也使用 $ 符号作为简写（...原创 2019-06-03 22:56:26 · 244 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(二)--核心函数&&jQuery对象
核心函数函数列表函数说明：jQuery() 主要用于获取HTML DOM元素并将其封装为jQuery对象jQuery():jQuery()函数是jQuery库的最核心函数，jQuery的一切都是基于此函数的。该函数主要用于获取HTML DOM元素并将其封装为jQuery对象，以便于使用jQuery对象提供的其他属性和方法对DOM元素进行操作。jQuery()函数的功...原创 2019-06-04 16:28:42 · 238 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(三)--静态方法详解
jQuery静态方法什么是静态方法?静态方法对应的是对象方法,对象方法用实例对象调用,而静态方法用类名调用。// 1.定义一个类 function AClass() { } // 2.给这个类添加一个静态方法 // 直接添加给类的就是静态方法 AClass.staticMethod = function...原创 2019-06-05 19:22:37 · 274 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(四)--内容选择器
内容选择器我们在使用Vscode或者WebStrom的时候，会使用 .setClass来设置元素的class，使用 #setId 设置元素的id，这其实就是简单的基本选择器所谓的内容选择器指的是可以根据元素中所包含的内容来实现相关验证,对于元素内容的判断,可以选择如下的选择器判断:contains(内容) 返回包含指定文本内容的所有元素 元素集合 :empt...原创 2019-06-07 12:02:22 · 200 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(五)--属性及属性节点
什么是属性? 对象身上保存的变量就是属性如何操作属性?对象.属性名称 = 值;对象.属性名称;对象["属性名称"] = 值;对象["属性名称"];什么是属性节点?<span name = "it666"></span>在编写HTML代码时,在HTML标签中添加的属性就是属性节点在浏览器中找到span这个DOM元素之后, 展开看到的...原创 2019-06-07 18:51:32 · 197 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(六)--attr&prop方法
创建页面元素<span class="span1" name="it666"></span><span class="span2" name="yjk"></span>jQuery的attr方法attr(name|pro|key,val|fn)作用: 获取或者设置属性节点的值可以传递一个参数, 也可以传递两个参数如果传递一个...原创 2019-06-07 19:29:49 · 208 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(七)--CSS类操作&文本值操作
不了解属性以及属性操作的同学可以看我之前的博客：Mr.J-- jQuery学习笔记(五)--属性及属性节点下面demo 中btn用到的角标，之前写验证码动态强度测试时也用过同样方法：Mr.J--密码强度检测CSS类属性操作页面渲染<!DOCTYPE html><html lang="en"><head> <meta chars...原创 2019-06-10 15:09:30 · 174 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(八)--CSS样式操作
CSS与JavaScript是两个有着明确分工的领域，前者负责页面的视觉效果，后者负责与用户的行为互动。但是，它们毕竟同属网页开发的前端，因此不可避免有着交叉和互相配合。那么如果通过JavaScript操作CSS呢？原创 2019-06-10 15:32:10 · 209 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(九)--事件绑定&移除&冒泡
事件绑定页面渲染<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title></head><body><button>我是按钮</button><...原创 2019-06-11 15:27:40 · 373 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(十)--trigger方法详解
看本篇文章之前建议先看这篇：Mr.J-- jQuery学习笔记(九)--事件绑定&移除&冒泡也可以看我的专栏：Mr.J--jQuery学习定义和用法trigger() 方法触发被选元素的指定事件类型。触发事件规定被选元素要触发的事件。语法$(selector).trigger(event,[param1,param2,...])参数 ...原创 2019-06-12 20:08:17 · 384 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(十一)--事件委托
jQuery事件委托 事件委托是利用事件冒泡，只指定一个事件处理程序来管理某一类型的所有事件。为什么要用事件委托？ 1.在JavaScript中添加到页面上的事件处理程序的个数直接关系到页面的整体运行性能。为什么呢？因为，每个事件处理函数都是对象，对象会占用内存，内存中的对象越多，性能就越差。此外，必须事先指定所有的事件处理程序而导致的DOM访问次数，会延迟整个页面的...原创 2019-06-13 19:31:41 · 252 阅读 · 1 评论 -
Mr.J-- jQuery学习笔记(十二)--移入移出事件&&电影排行榜小demo
jQuery的鼠标移入与移出事件mouseover与mouseenter不论鼠标指针穿过被选元素或其子元素，都会触发 mouseover 事件。只有在鼠标指针穿过被选元素时，才会触发 mouseenter 事件。//1.监听li的移入事件 $("li").mouseenter(function () { $(this).a...原创 2019-06-15 09:57:13 · 295 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(十三)--选项Tab卡
页面渲染<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>36-TAB选项卡上</title> <style> *{ margin: 0; ...原创 2019-06-17 14:40:08 · 176 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(十四)--动画显示隐藏
eq()函数定义和用法:eq() 选择器选取带有指定 index 值的元素。index 值从 0 开始，所有第一个元素的 index 值是 0（不是 1）。经常与其他元素/选择器一起使用，来选择指定的组中特定序号的元素（如上面的例子）。语法$(":eq(index)")参数 描述 index 必需。规定元素的 index 值。 show(...原创 2019-06-17 14:57:54 · 243 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(十五)--实现页面的对联广告
请看之前的：Mr.J-- jQuery学习笔记(十四)--动画显示隐藏话不多说，直接上demo<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>对联广告</title> <style> ...原创 2019-06-18 15:24:06 · 299 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(十六)--展开和收起动画&&折叠菜单的实现
之前写过动画的隐藏与显示：Mr.J-- jQuery学习笔记(十四)--动画显示隐藏 动画隐藏与显示的一个小demo--对联广告：Mr.J-- jQuery学习笔记(十五)--实现页面的对联广告与动画隐藏与显示对应的，展开和收起也有三个主要方法:slideDown()定义和用法slideDown() 方法通过使用滑动效果，显示隐藏的被选元素。语法$(sele...原创 2019-06-18 15:37:50 · 1284 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(十七)--动画淡入淡出&&弹窗广告
之前写过动画的隐藏与显示：Mr.J-- jQuery学习笔记(十四)--动画显示隐藏 动画隐藏与显示的一个小demo--对联广告：Mr.J-- jQuery学习笔记(十五)--实现页面的对联广告展开和收起动画&&折叠菜单的实现:Mr.J-- jQuery学习笔记(十六)--展开和收起动画&&折叠菜单的实现动画的淡入淡出下面实例要用的页面元素：...原创 2019-06-20 10:19:30 · 310 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(十八)--自定义动画
animate(params,[speed],[easing],[fn])概述用于创建自定义动画的函数。这个函数的关键在于指定动画形式及结果样式属性对象。这个对象中每个属性都表示一个可以变化的样式属性（如“height”、“top”或“opacity”）。注意：所有指定的属性必须用骆驼形式，比如用marginLeft代替margin-left.而每个属性的值表示这个样式属性到多少...原创 2019-06-20 10:52:51 · 208 阅读 · 0 评论 -
Mr.J--jQuery效果总结
动画显示隐藏: Mr.J-- jQuery学习笔记(十四)--动画显示隐藏实现页面的对联广告: Mr.J-- jQuery学习笔记(十五)--实现页面的对联广告展开和收起动画&&折叠菜单的实现:Mr.J-- jQuery学习笔记(十六)--展开和收起动画&&折叠菜单的实现动画淡入淡出&&弹窗广告:Mr.J-- jQuery学习...原创 2019-06-20 10:58:25 · 217 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(十九)--自定义动画实现图标特效
之前有写过自定义动画Mr.J-- jQuery学习笔记(十八)--自定义动画这次实现一个小demo图标特效页面渲染<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> <sty...原创 2019-06-21 10:10:12 · 207 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(二十)--节点操作方法
Table of Contents添加节点内部插入外部插入删除节点remove([expr])empty() detach([expr])替换节点replaceWith(content|fn)replaceAll(selector)复制节点clone([Even[,deepEven]])浅复制深复制浅复制和深复制的区别 ...原创 2019-06-21 11:00:53 · 565 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(二十一)--模拟微博页面
先看之前的节点操作方法：Mr.J-- jQuery学习笔记(二十)--节点操作方法Mr.J-- jQuery学习笔记(五)--属性及属性节点Mr.J-- jQuery学习笔记(十一)--事件委托 ：delegate()方法页面样式主要写一下实现各种功能的方法JS-demo输入内容判断是否输入了内容让按钮可用让按钮不可用$("body").del...原创 2019-06-23 15:41:42 · 352 阅读 · 1 评论 -
Mr.J-- jQuery学习笔记(二十二)--入口函数
入口函数的作用：等待页面加载完毕，有一个独立的作用域。原生JS 和 jQuery 入口函数区别：（1）JS的window.onload事件必须要等到所有内容，以及外部图片之类的文件加载完之后，才会去执行。（2）JQuery入口函数是在所有标签加载完之后，就会去执行。jQuery基本结构jQuery是一个闭包之前有写过闭包：Mr.J--JS学习（闭包及IIFE）Mr....原创 2019-06-23 17:21:19 · 422 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(二十三)--apply&call
之前在学习JavaScript的时候写的:Mr.J--JS学习（继承模式发展史）里面写了我对原生JS call和apply的理解，以及原型链的应用：prototypeapply&callJavaScript中的每一个Function对象都有一个apply()方法和一个call()方法，它们的语法分别为：/*apply()方法*/function.apply(thisObj...原创 2019-06-25 09:49:36 · 324 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(二十四)--剖析jQuery源码--extend
定义和用法jQuery.extend() 函数用于将一个或多个对象的内容合并到目标对象。注意：1. 如果只为$.extend()指定了一个参数，则意味着参数target被省略。此时，target就是jQuery对象本身。通过这种方式，我们可以为全局对象jQuery添加新的函数。2. 如果多个对象具有相同的属性，则后者会覆盖前者的属性值。语法$.extend( target...原创 2019-06-25 14:20:28 · 191 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(二十五)--监听DOM加载
页面元素<body><div></div><div></div><div></div><div></div></body>onload和DOMContentLoaded对于DOM事件加载的区别onload事件会等到DOM元素加载完毕, 并且还会等到...原创 2019-06-28 11:30:59 · 564 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(二十六)--jQuery原型上的属性&&方法
jQ原型上的核心方法和属性页面元素<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> <script src="js/jQuery-1.12.4.js"></scrip...原创 2019-06-29 12:21:21 · 302 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(二十七)--DOM操作方法(删除&获取文本)
清除<body><button>调用remove</button><div> 我是div <p>我是段落</p></div><div class="box"> 我是div <p>我是段落</p></div><p ...原创 2019-06-29 18:24:45 · 394 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(二十八)--DOM操作方法(添加方法总结)
appendTo<body><button>调用appendTo</button><p>我是段落</p><p>我是段落</p><div class="item"> <li>1我是第1个li</li> <li>1我是第2个li<...原创 2019-06-29 18:28:15 · 278 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(二十九)--属性操作方法（获取属性&判断）
获取attr()<span class="span1" name="it666"></span><span class="span2" name="yjk11"></span>设置或者获取元素的属性节点值传递一个参数, 返回第一个元素属性节点的值console.log($("span").attr("class"));...原创 2019-07-06 10:48:21 · 276 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(三十)--属性操作方法（添加&删除）
添加addClass()给元素添加一个或多个指定的类<div class="aabb abc"></div><div class="aabb"></div>传递参数, 如果元素中没有指定类就添加, 有就不添加，会返回this方便链式编程进行链式添加没有传递参数,不做任何操作,返回this删除re...原创 2019-07-06 11:04:05 · 161 阅读 · 0 评论 -
Mr.J-- jQuery学习笔记(三十一)--事件操作方法(on&off)
on(type, callback)定义和用法on() 方法在被选元素及子元素上添加一个或多个事件处理程序。自 jQuery 版本 1.7 起，on() 方法是 bind()、live() 和 delegate() 方法的新的替代品。该方法给 API 带来很多便利，我们推荐使用该方法，它简化了 jQuery 代码库。注意：使用 on() 方法添加的事件处理程序适用于当前及未来的元素...原创 2019-07-11 09:17:58 · 316 阅读 · 0 评论