jQuery是JS的工具库,对原生JS中的DOM操作、事件处理、包括数据处理和Ajax技术等进行封装,使用 . 链式写法,提供更完善,更便捷的方法。 再使用jquery之前,我们需要先引入jquery文件,才能使用jquery语法,导入jQ文件的方法有两种。 从 jquery.com 下载 jQue ...
ajax 不重新加载整个网页的情况下,更新部分网页的技术 注意:ajax只有在服务器上运行才能生效,我在本地一般用phpstudy 优点: 1、优化用户体验 2、承担了一部分本该服务器端的工作,减轻了服务器端的压力 3、优化了服务器端和浏览器端的传输,减少了带宽占用 缺点: 1、不支持回退按钮 2、 ...
方法一: if ($("#checkbox-id").get(0).checked) { // do something } 方法二: if($('#checkbox-id').is(':checked')) { // do something } 方法三: if ($('#checkbox-id' ...
jQuery初学者笔记 一 Mirror王宇阳 by jQuery语法 jQuery语法是通过选取HTML元素,并对选取的元素进行操作 基础语法: 所有jQuery语句用“$”符号开始 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <tit ...
在移动端做了个导航,长这样 原来结构是用的span <span class="menu_icon"> <img src="img/icon_1.png"> <p>导航</p> </span> 绑定用的是jquery的.click $('.menu_icon').click(function () { ...
jquery.ui实现新闻模块 jquery也有ui,了解即可,用的不多,类似element ui 和bootstrap JQuery UI API: jquery.ui实现新闻模块 draggale拖动,并用属性handle,指定下拖动手柄 $(".drag-wrapper").draggable ...
jquery.color.js的使用 了解即可 <!--1. 引入jquery的js文件--> <script src="jquery-1.12.4.js"></script> <!--2. 引入插件的js文件--> <script src="jquery.color.js"></script> < ...
jQuery插件 使用插件的步骤 1. 引入jQuery文件 2. 引入插件(如果有用到css的话,需要引入css) 3. 使用插件 <!--1. 引入jquery的js文件--> <script src="jquery-1.12.4.js"></script> <!--2. 引入插件的js文件-- ...
$冲突的解决方案 遇到其他js文件也用$包装了函数。可以把jQuery放在后面,并释放下$的控制权,也可以换个字符替代原来的$,例如$$ 或者,jQuery //jQuery释放$的控制权 $$ = $.noConflict(); <!DOCTYPE html> <html lang="zh-CN" ...
each方法 each方法 //each方法 $("li").each(function (index, element) { $(element).css("opacity", (index + 1) / 10); }) for循环方法 for (var i = 0; i < $("li").le ...
五角星评分案例 1. 鼠标经过li的时候,当前的位置是实心五角星,前面的是实心。当前位置后面的是空心。注意此处不能完全用链式编程写到底 2. 鼠标离开,comment的所有孩子变为空心五角星。额外,找到current, 让current和它的前面都是实心。 3. 点击li的时候,当前的位置增加个cu ...
链式编程 设置性操作:可以链式编程 获取性操作,不能链式,因为获取性操作,数值,字符串,返回值是不是一个jq对象。 $(function () { //设置性操作:可以链式编程 //获取性操作,不能链式,因为获取性操作,数值,字符串,返回值是不是一个jq对象。 $("div").width(200) ...
钢琴案例 (按下1-9数字键,能触发对应的mouseenter事件) 1. 结合之前的学习,主要内容,就是on注册keyup事件,函数里传入e, 用e.keyCode,来获取1-9的数字的范围。 如果所按的按键在49-57的范围里,就去触发mouseenter(or mouseleave)事件。 怎 ...
事件对象 jQuery事件对象其实就是js事件对象的一个封装,处理了兼容问题 e.data 存储绑定事件时传递的附件数据 传入e, 再console.log(e)可以查看 //100,注册的时候的时候,把100传到事件里面去。 var money = 100; //on(types, selecto ...
事件解绑与事件触发 $("p").off("click"); $("#btn").on("click", function () { //触发p元素的点击事件 //$("p").click(); $("p").trigger("click"); }); ...
表格删除案例 on的简单事件 //1. 找到清空按钮,注册点击事件,清空tbody $("#btn").on("click", function () { $("#j_tb").empty(); }); on的委托事件 //2. 找到delete,注册点击事件 $("#j_tb").on("clic ...
事件的执行顺序 // 1 这个是p自己注册的事件(简单事件) $("p").on("click", function () { alert("呵呵哒"); }); // 2 给div自己执行的 $("div").on("click", function () { alert("呜呜呜"); }); ...
on注册事件的2种方式 on注册事件的语法 on注册简单事件 // 这个是p自己注册的事件(简单事件) $("p").on("click", function () { alert("呵呵"); }); $("#btn").on("click", function () { $("<p>我是新建的p ...
jQuery事件发展历程 事件发展历程:从简单事件,到bind,到委托事件,到on事件绑定 //简单事件,给自己注册的事件 $("div").click(function () { alert("哈哈"); }); //bind方式 $("p").bind({ click: function () ...
offset方法和position方法 获取元素的相对于document的位置 //获取元素的相对于document的位置 $(".son").offset(); console.log($(".son").offset()); 获取元素相对于有定位的父元素的位置 //获取元素相对于有定位的父元素的 ...