正文

初识jquery

chuanzi  chuanzi  2022-12-21  410

关键词：

初识jQuery

1、jQuery本质

(function( window, undefined ) var jQuery = function( ) return new jQuery.prototype.init( ); jQuery.prototype = constructor: jQuery jQuery.prototype.init.prototype = jQuery.prototype; window.jQuery = window.$ = jQuery; )( window ); 1.1.jQuery的本质是一个闭包 jQuery为什么要使用闭包来实现?为了避免多个框架的冲突 1.2、jQuery采用了面向对象的方法，jQuery是原始类名，$符号和jQuery等价 1.3.jQuery如何让外界访问内部定义的局部变量：window.xxx = xxx; 1.4.jQuery为什么要给自己传递一个window参数? 为了方便后期压缩代码，提升查找的效率 1.5.jQuery为什么要给自己接收一个undefined参数? 为了方便后期压缩代码 IE9以下的浏览器undefined可以被修改, 为了保证内部使用的undefined不被修改, 所以需要接收一个正确的undefined

2、jQuery构造方法

jQuery = function( selector, context ) return new jQuery.fn.init( selector, context, rootjQuery ); 传参处理： 2.1、不传参或传递空字符串、null、undefined、NaN、0、false时，返回一个空的jQuery对象 2.2、$(callback)：如果传入的参数是一个函数，则在document上绑定一个ready事件监听函数，当DOM结构加载完成时执行。ready事件触发要早于load事件，ready事件并不是浏览器的原生事件。该函数称为jQuery的入口函数 2.3、$(selectorStr [,context])，接收一个字符串选择器，返回一个jQuery对象，没匹配到则返回一个空jQuery对象。这里的context选择器称为"上下文"，其格式有以下几种：写法例如: $(‘p‘,‘#p_wrap‘) //在遍历时缩小范围id $(‘p‘,‘div‘) //DOM元素 $(‘p‘, $(‘div‘)) //jQuery对象 $(‘domElement‘, this) //用于当前指定的DOM元素范围内 2.4、$(html [,ownerDocument])，$(html, props) 如果传入的是html代码片段，就会用这些代码创建新的DOM元素，然后创建并返回一个包含这个元素引用的jQuery对象。如果html代码是一个单独的标签，jQuery源码的实现是使用浏览器原生方法 document.creatElement()创建一个DOM元素；如果是比较复杂的html片段，jQuery源码实现使用浏览器的innerHtml机制创建DOM元素，这个过程由两个方法完成的。若html代码是一个单独标签，第二个参数可以是props,props是一个包含了属性、事件的普通对象。在调用document.createElement()创建DOM元素后，props会被传给jQuery方法.attr(), 然后由attr()负责把参数props中的属性、事件设置到新创建的元素上。 2.5、$(element)，$(elementArray)，如果传入一个DOM元素或DOM元素数组，则把DOM元素封装到jQuery对象中并返回。 2.6、$(object),传入一个普通的JavaScript对象，则把该对象封装到jQuery对象中并返回。 2.7、$(jQuery object)如果传入一个jQuery对象，则创建该jQuery对象的一个副本并返回(相当于克隆,深拷贝？)。 2.8、传入一个基本数据类型，会将传入的基本数据类型存储到jQuery对象中返回

3、jQuery入口函数

3.1、4种等效写法 $(function()); jQuery(function()); $(document).ready(function()); jQuery(document).ready(function ()); 3.2、jQuery入口函数 vs window.onload 执行顺序：jQuery入口函数在window.onload之前执行 window.onload会等到DOM元素加载完毕,并且图片也加载完毕才会执行 jQuery会等到DOM元素加载完毕,但不会等到图片也加载完毕就会执行故通过jQuery入口函数不可以拿到图片元素的宽高覆盖问题： window.onload如果多次赋值,则后面编写的会覆盖前面编写的 jQuery中编写多个入口函数,后面的不会覆盖前面的

4、$符号使用冲突问题

4.1、释放$的使用权：直接调用jQuery.noConflict()方法注意点: 释放操作必须在编写其它jQuery代码之前编写，释放之后就不能再使用$,改为使用jQuery 4.2、自定义一个访问符号：var jq=jQuery.noConflict() 注意，这个自定义的符号也要遵循js标识符命名规范

初识jquery

初识jQuery这篇文章是作为自己的第一篇博客，选择jQuery是因为目前正在学习这个，对于jQuery的基本认知在此不会多说（百度即可），只是想记录一下jQuery基本原理，它与JavaScript有什么不同，为什么专业人士称为jQuery库而不是jQuer... 查看详情

jquery初识

jQuery是什么？jQuery是一个兼容多浏览器的JavaScript库。jQuery能极大地简化JavaScript编程，它的宗旨就是："Writeless,domore."jQuery包含以下内容：HTML元素选取HTML元素操作CSS操作HTML事件函数JavaScript特效和动画HTMLDOM遍历和修改AJAX下载链接... 查看详情

初识jquery

1.JQuery语法$(sector).action()美元符号定义jQuery选择符（selector）"查询"和"查找"HTML元素jQuery的action()执行对元素的操作实例$(document).ready(function() $("p").onclick(function() alert("这是我查看详情

初识jquery

1.Jquery是对JavaScript对象和函数的封装（JavaScript框架）2.怎么使用Jquery第一步：把js文件放入项目中第二步：在页面引用jquery<scripttype=”text/javascript” src=”js/jquery-1.8.3.min.js”></script>第三步：使用$(function(){//代码});3.$(... 查看详情

初识jquery

jQuery简介　　jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery设计的宗旨是“writeLess，DoMore”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码... 查看详情

初识jquery-选择器

初识jquery 在学习jquery之前，就有看过一些相关的视频，才知道它是可以写很少的代码就可以完成很多事的。记得第一写轮播图的时候，首先就百度了篇轮播图的实现，当时还不知道自己百度的其实不是... 查看详情

初识jquery

什么是jQuery？jQuery是目前最流行的JavaScript程序库，它是对JavaScript对象和函数的封装；jQuery能做什么？访问和操作DOM元素控制页面元素对页面事件进行处理扩展新的jQuery插件与Ajax技术完美结合jQuery的优势：体积小，压缩后只有10k... 查看详情

初识jquery

1.jquery是基于js的一个封装库，屏蔽我们之间书写js代码考虑浏览器兼容性的问题。问题交个框架的编写者。jquery团队。市面上常见的jquery，企业生产环境中经常使用js库，jquery是以后大家学习其他封装的基础库，99%的企业都在使... 查看详情

初识jquery

<!DOCTYPEhtml><html><headlang="en"><metacharset="UTF-8"><title>测试</title><scripttype="text/javascript"src="js/jquery-1.12.4.js"></script><scripttype= 查看详情

初识jquery

jQuery是JavaScript的程序库之一，它是JavaScript对象和实用函数的封装。一、jQuery的用途　　01、访问和操作DOM元素　　　　提供了一整套方便、快捷的方法来实现对指定元素的增删改查，既减少了代码量，又提高用户体验　　02、控... 查看详情

初识jquery

1.DOM模型1.1以对象描述文档的方式就是DOM节点对象就是被称为DOM对象（标签对象）1.2节点元素节点（标签）文本节点（标签内容）属性节点（标签属性）2.Jquery语法结构$(“选择器”).方法名();eg:$(“#id”).html();部分方法：css();//改... 查看详情

初识jquery

1<!DOCTYPEhtml>2<html>3<headlang="en">4<metacharset="UTF-8">5<title>jquery对象的获取方式</title>67<!--直观的就是将dom对查看详情

jquery初识(代码片段)

一丶什么是JQuery　　jQuery 是js的一个库,封装了我们开发过程中常用的一些功能,方便我们调用,提高开发效率　　js库是把我们常用的功能放到一个单独的文件中,我们用的时候,直接引用到页面里即可　　关于jQuery的相关资... 查看详情

初识jquery(代码片段)

JQuery是对JavaScript的封装，简化了JS代码，是主流框架的基础(VUE,EasyUI,Bootstrap)它是2006年推出的 JQuery的优势：体积小，压缩后只有100KB左右强大的选择器出色的DOM封装可靠的事件处理机制出色的浏览器兼容性使用隐式迭代... 查看详情

javascript--初识jquery及公式(代码片段)

1.初识JQuery及公式1.1下载JQueryJQuery官网:我们点击开发版本,进入了如下页面接下来全选里面的内容,保存下来放在txt文档里面然后给txt文件改名,改为jq.js(自定义,但文件拓展名必须是js)现在我们就成功的下载了Jquery1.2引入JQuery使用jQ... 查看详情

jquery初识(三)(代码片段)

一丶JQuery的文档操作　　1.插入操作:　　　　父元素.append(子元素)　　　　解释:追加某元素,在父元素中添加新的子元素.子元素可以为:stirng|element(js对象)|JQuery元素varoli=document.createElement(‘li‘);oli.innerHTML=‘哈哈哈‘;$(‘ul‘).app... 查看详情

初识jquery

轻量级的js库兼容各种浏览器＋css3传统：js＋DHTM jq:解放了客户端的编程，环境搭建进入官方网站获取最新的版本 http://jquery.com/download/ ，这里需要注意jQuery分2个系列版本 1.x 与 2.x，主要的区别在于2.x不再... 查看详情

jquery初识jquery，简单使用jquery。

　　　　　　距离上一篇博文好像隔了很久的时间了额。好像是堕落了一阵子，前些时间去杭州找工作，被租房的事情给搞懵逼了，然后就回来了，回来在修炼一个月在出去奋斗把！加油，这两天把jquery，easyui和bootstrap这几个东... 查看详情