通过问题看本质: 举例: js的写法:document.getElementById('save').disabled=true; 在jquery中我是这样写的
JavaScript 开发的过程中,处理浏览器的兼容很复杂而且很耗时,于是一些封装了这些操作的库应运而生。这些库还会把一些常用的代码进行封装。
jQuery里面放了Dom对象,把jQuery比作一个伪数组,就是没有数组的方法,但是有自己的方法(jQuery的方法)
基本过滤选择器 内容过滤选择器 可见性过滤选择器 属性过滤选择器 子元素过滤选择器
jquery学习 --Day2 (jquery的基本使用) 区分DOM对象和jquery对象 DOM对象:用原生JS获取过来的对象是DOM对象 Jquery对象:用jquery的方式获取过来的对象是jquery对象,实质:通过$把DOM元素进行了包装(伪数组形式存储) DOM对象 fdsahfsjdiofdsfkas <script> var div = document.querySelector('div'); console.dir(div);
js库:把一些常用到的方法写到一个单独的js文件,使用的时候直接去引用这js文件就可以了。(animate.js、common.js)
JavaScript的入口函数要等到页面中所有资源(包括图片、文件)加载完成才开始执行。
jQuery就是一个js库,使用jQuery的话,会比使用JavaScript更简单。
var $p= $('p')新建一个jquery对象,一般在新建jquery对象的时候,加上一个$,以便好认。
1、关于页面元素的引用 通过jquery的$()引用元素包括通过id、class、元素名以及元素的层级关系及dom或者xpath条件等方法,且返回的对象为jquery对 象(集合对象),不能直接调用dom定义的方法。 2、jQuery对象与dom对象的转换 只有jquery对象才能使用jquery定义的方法。注意dom对象和jquery对象是有区别的,调用方法时要注意操作的是dom对象还是 jquery对象。 普通的dom对象一般可以通过$()转换成jquery对象。 如:$(document.getEl
当我们点击文字的时候会添加一个【p_text】class,对应的style就会生效。
通过类数组下标的获取方式或者get方法获取指定index的DOM对象,也就是我们说的jQuery对象转DOM对象
作为一个后端程序员,也是要和前端页面打交道的。最常见的场景莫过DOM元素操作和前端页面使用AJAX向服务器发送请求。 实现上述两个功能当然可以使用原生js来完成,但在实际开发过程中很少这样做,通常会使用一些别人封装好的js库来辅助我们的工作,jQuery就是这些辅助库中的一员。
(本文年代久远,请谨慎阅读)今天学习了JQuery的一些基本用法,包括JQuery选择器和JQuery包装集;
随着WEB2.0及ajax思想在互联网上的快速发展传播,陆续出现了一些优秀的Js框架,其中比较著名的有Prototype、YUI、jQuery、mootools、Bindows以及国内的JSVM框架等,通过将这些JS框架应用到我们的项目中能够使程序员从设计和书写繁杂的JS应用中解脱出来,将关注点转向功能需求而非实现细节上,从而提高项目的开发速度。
大家好!我是你们的老朋友Java学术趴,今天继续给大家分享jQuery的相关知识。jQuery 底层 AJAX 实现。简单易用的高层实现 .get,.post 等。$.ajax() 返回其创建的 XMLHttpRequest 对象。大多数情况下你无需直接操作该函数,除非你需要操作不常用的选项,以获得更多的灵活性。话不多说,接下来详细给大家介绍jQuery核心知识。
DOM是针对HTML和XML文档的一个API(应用程序编程入口)。DOM描绘了一个层次化的节点树,允许开发人员添加/移除和修改页面某一部分。 注:从上面的引述中可以得知,DOM不仅存在于HTML中,DOM也不是JS的一部分。DOM只是提供了一些规范,具体JS就是根据这些规范去实现它提出的一些接口 。 这里有个问题, IE中所有的DOM对象都是以COM对象实现的,所以DOM对象和JS原生对象行为或活动特点不一致。这也导致JS对象引用IE DOM对象会内存泄漏。 JS中实现了一个Node类型,所有节点都集成它,
1、jQuery优点 轻量级,强大的选择器,出色的DOM操作,可靠的事件处理,完善的Ajax,不污染的顶级变量,出色的浏览器兼容,链式操作,隐式迭代,行为层和结构层分离,丰富的插件,完善的文档,开源 2、类型说明 Jquery-*.js完整的版本,主要用于测试和学习开发 Jquery-*.min.js主要用于产品和项目 3、引入jquery开始学习 <script src=”jquery-1.7.2.js” type=”text/javascript”></script> 4、JQuery宗旨 用少量的代码
jQuery的官网地址: https://jquery.com/,官网即可下载最新版本。
写入口函数防止页面上的标签还没有被渲染出来,js代码就执行了 不同于js,JQuery可以有多个入口函数
jQuery的官网地址: https://jquery.com/,官网即可下载最新版本。
提示allp[i].attr()不是一个方法,而attr()是jq对象的方法,这个报错等于说allp[i]不是一个jq对象。 参考stackoverflow ,可知$()[i]返回的的确不是jq对象,而是原生dom对象,无法使用jq方法attr() 。
JavaScript库:即 library,是一个封装好的特定的集合(方法和函数)。从封装一大堆函数的角度理解库,就是在这个库中,封装了很多预先定义好的函数在里面,比如动画animate、hide、show,比如获取元素等。
JavaScript,弱类型脚本语言,增强交互和用户体验提高效率等。JavaScript=ECMAScript+JavaScript特有的内容(BOM对象+DOM对象) ECMAScript:与html结合:内部JS(script标签定义,在html文档内部,按位置先后执行),外部JS(script标签引入src元素), 注释:当行//,多行/**/,数据类型:原始数据类型(基本,number[整数,小数,NaN not a number],string,boolean,null,undefined),引用数据类型(对象) 变量,var定义,开辟空间不定义类型。赋值可改变类型。document.write输出,添加标签字符串换行。typeof(变量)关键字,打印数据类型(null是一个object的bug)。 运算符,一元运算符:++,--,+-(正号,负号[可以将其他类型转number,无法转换为NaN]),算数运算符:+-*/%,赋值运算符=,+=,-=,比较运算符:>,>=,<,<=,==,!=,类型不同则转换类型比较,===(不转换类型比较)。
1.jquery介绍:想必大家都用过jquery吧,这个曾经也是现在依然最流行的web前端js库,可是现在无论是国内还是国外他的使用率正在渐渐被其他的js库所代替,随着浏览器厂商对HTML5规范统一遵循以及ECMA6在浏览器端的实现,jquery的使用率将会越来越低
jQuery的杰出的DOM操作能力相信已经深入每一个前端Coder,在使用Vue之前我并不能习惯数据驱动的概念,仍然幻想着把jQuery引入到Vue中,直到深入使用Vue以后才发现,原来许多jQ操作DOM的方法都不需要,数据驱动比手工操作DOM方便快捷许多。尽管如此,Vue仍然给了我们原生DOM控制的能力。 环境是由Vue-Cli搭建的webpack模板,省略CSS部分 HTML部分 <div clas09jQuery笔记(1) (多图)即library,是一个封装好的特定的集合(方法和函数).从封装一大堆函数的角度理解库,就是在这个库中,封装了很多预先定义好的函数在里面,比如animate,hide,show,比如获取元素等/01JavaScript进阶内容——jQuery我们在前面的文章中已经掌握了JavaScript的全部内容,现在让我们了解一下JavaScript库01js行内式遇到的一些问题 DOM对象和jq对象转换的问题这两天给后台页面做页面,我的工作比较简单,只需要写结构和样式就行了,写好之后,后端大哥用ajax重写页面加载数据,顺便给标签添加选中事件,做选中后变色的处理,但是却遇到一个问题,一直选不到触发事件这个对象。简单还原代码如下 <button id='btn' onclick='check()' name='abc' value='123'>类别</button> <script> function check() { console.log($(this).name); } </script> 遇到的05jQuery介绍与常见选择器的使用jQuery是继Prototype之后又一个优秀的JavaScript库,是一个由John Resig创建与2006年1月的开源项目。现在的jQuery团队主要包括核心库、UI、插件和jQuery Mobile 等开发人员以及推广和网站设计、维护人员。01一文玩转jQuery+Ajax简介:jQuery 是一个轻量级的"写的少,做的多"的 JavaScript 库。02jquery和vue.js的区别1.jQuery首先要获取到dom对象,然后对dom对象进行进行值的修改等操作 2.Vue是首先把值和js对象进行绑定,然后修改js对象的值,Vue框架就会自动把dom的值就行更新。 3.可以简单的理解为Vue帮我们做了dom操作,我们以后用Vue就需要修改对象的值和做好元素和对 象的绑定,Vue这个框架就会自动帮我们做好dom的相关操作 4.这种dom元素跟随JS对象值的变化而变化叫做单向数据绑定,如果JS对象的值也跟随着dom元素的值的变化而变化就叫做双向数据绑定02稳扎稳打JavaScript(四)——闭包闭包是JS语言的又一大核心,如果要从内存角度充分理解闭包的话,建议大家先预习下先前的几篇讲博客: 稳扎稳打JavaScript(一)——作用域链 稳扎稳打JavaScript(二)——图解对象内存模型 稳扎稳打JavaScript(三)——创建对象的几种方式 什么是闭包 定义 闭包是一个能够访问其他函数作用域的函数。 这句话看似拗口,如果读过先前的几篇博客,那理解起来应该不难。下面来解析一下这句话: 首先,闭包是一个函数; 其次,这个函数不仅能访问自己的作用域,更为关键的是它还能访问其他函数的06JavaScript奇淫技巧(一)if-else简化写法 代码中若出现多层if-else嵌套,代码就会显得臃肿不堪,这时可采用替代方案来浓缩代码。 常规写法:(臃肿不堪) if(){ if(){ //…… } else{ //…… } } else{ //…… } 简化写法:(一行搞定) (a) && (b) || (c); 上述表达式含义:若条件a为true则执行表达式b,否则执行表达式c。 原本多行的if-else语句一行就可以搞定。 此外,该句式支持多层06渐进式React源码解析--State源码文章中涉及到的知识都是渐进式的讲解开发,当然如果对之间内容不感兴趣(已经了解),也可以直接切入本文内容,每一个章节都和之前不会有很强的耦合。03详解React核心工作原理react中虚拟dom+jsx的设计一开始就有,vue则是演进过程中才出现的,2.0版本后出现。02VUE开发–获取DOM对象和组件对象(十九)一、vue通过$refs获取到dom对象(获得dom对象改变里面的内容) 模板: <button @click="getdata">获取dom对象</button> 这是一个div js: methods: { getdata: function() { //在这个方法中通过vue形式获取到div的对象,比js和jq都方便 console.log(this.$refs.mydiv); //改变div01前端基础-Ajax框架的封装如果一个页面中有十几个地方用到Ajax,那么我们需要写十几次open()、十几次send()、十几次获取xhr对象; 代码重复相当多,而凡是有代码重复的地方,就有封装的可能;01React核心工作原理react中虚拟dom+jsx的设计一开始就有,vue则是演进过程中才出现的,2.0版本后出现。02树形图拖拽插件tree-drag | 开源项目推荐好多天前,领导让我实现一个树形图拖拽插件,这个插件用来描述各部门领导与员工之间的关系,每个父节点显示其子结点数量,拖拽任意一个叶结点上的人到另一个结点,他们之间的关系发生改变,树形图重新渲染。用户操作都完成后,点击保存根据树形图生成JSON,将JSON发送给后端,后端根据JSON修改数据库中的人员对应关系。022018-07-161 初识JQuery进入官方网站获取最新的版本 http://jquery.com/download/ ,这里需要注意 jQuery 分 2 个系列版本 1.x 与 2.x,主要的区别在于 2.x 不再兼容 IE6、7、8浏览器,这样做的目的是为了兼容移动端开发。由于减少了一些代码,使得该版本比 jQuery 1.x 更小、更快。01jQuery学习笔记——jQuery基础什么是jQuery?jQuery是一个快速、简洁的JavaScript库,其设计宗旨是“write less,do more”,倡导用更少的代码,做更多的事情。通过这段时间的学习,我感觉jQuery是一个“语法糖”,就像是包在糖果外面的包装,让js看起来更好看。01从零开始学 Web 之 DOM(三)innerText与innerHTML、自定义属性大家好,这里是「 Daotin的梦呓 」从零开始学 Web 系列教程。此文首发于「 Daotin的梦呓 」公众号,欢迎大家订阅关注。在这里我会从 Web 前端零基础开始,一步步学习 Web 相关的知识点,期间也会分享一些好玩的项目。现在就让我们一起进入 Web 前端学习的冒险之旅吧! 一、兼容代码 1、封装 innerText 和 TextContent // 设置任意标签的文本内容为任意内容 function setText(element, text) { (t03从零自己编写一个React框架 【中高级前端杀手锏级别技能】为了降低本文难度,构建工具选择了parcel,欢迎加入我们的前端交流群~ gitHub仓库源码地址和二维码都会在最后放出来~03react基础state:组件函数或类的成员,render一次渲染,setstate调用后值有更新才会重新调用render preps: 虚拟dom的属性,preps输出属性,html端显示输入02JS基础(上)JS与DOM的关系 浏览器有渲染html代码的功能,把html源码(如div,p标签等)在内存里形成一个DOM对象 文档对象模型DOM(Document Object Model)定义访问和处理HTM014JS逆向之浏览器补环境详解浏览器环境: 是指 JS代码在浏览器中的运行时环境,它包括V8自动构建的对象(即ECMAScript的内容,如Date、Array),浏览器(内置)传递给V8的操作DOM和BOM的对象(如document、navigator);02JavaWeb04-jQuery(Java真正的全栈开发)jQuery 一.jQuery入门 1.javascript类库 JavaScript 库封装了很多预定义的对象和实用函数。能帮助使用者建立有高难度交互客户端页面, 并且兼容各大浏览器。 核心理念是w09jQueryps:.offset()方法允许我们检索一个元素相对于文档(document)的当前位置,和 .position()的差别在于: .position()是相对于相对于父级元素的位移;01尚能饭否|技术越来越新,我对老朋友jQuery还是一如既往热爱最近在搭建完善自己的博客,需要用到一些页面样式之类的,就特意问了一下女朋友一个问题,关于Web前端开发,jQuery现在过时了嘛?她毅然决然告诉我,那是我们前端现在的鄙视链。是的,不可否认,现在框架盛行,jQuery早已被GitHub所遗弃。我依稀记得,两年前,我学前端知识,觉得这个框架真的很好,以后有时间,一定要好好学一下它。也就这么点时间,它早已淡出了前端开发者的视线。不过呢,我身为后端开发,也就是一个新人于前端来说,所以我还是很喜欢jQuery的思想,因为让我直接理解Vue/React的话,还是需要大量时间的,所以认为jQuery是一个不错的过渡选择,也可以学习下前端编程思想,我看中了它的人性化以及可读性很强,对于我们来说也很简单,所以本文带大家一起回忆那些jQuery的点点滴滴,也为我们前端知识打个牢固的技术基础。05
即library,是一个封装好的特定的集合(方法和函数).从封装一大堆函数的角度理解库,就是在这个库中,封装了很多预先定义好的函数在里面,比如animate,hide,show,比如获取元素等/
我们在前面的文章中已经掌握了JavaScript的全部内容,现在让我们了解一下JavaScript库
这两天给后台页面做页面,我的工作比较简单,只需要写结构和样式就行了,写好之后,后端大哥用ajax重写页面加载数据,顺便给标签添加选中事件,做选中后变色的处理,但是却遇到一个问题,一直选不到触发事件这个对象。简单还原代码如下 <button id='btn' onclick='check()' name='abc' value='123'>类别</button> <script> function check() { console.log($(this).name); } </script> 遇到的
jQuery是继Prototype之后又一个优秀的JavaScript库,是一个由John Resig创建与2006年1月的开源项目。现在的jQuery团队主要包括核心库、UI、插件和jQuery Mobile 等开发人员以及推广和网站设计、维护人员。
简介:jQuery 是一个轻量级的"写的少,做的多"的 JavaScript 库。
1.jQuery首先要获取到dom对象,然后对dom对象进行进行值的修改等操作 2.Vue是首先把值和js对象进行绑定,然后修改js对象的值,Vue框架就会自动把dom的值就行更新。 3.可以简单的理解为Vue帮我们做了dom操作,我们以后用Vue就需要修改对象的值和做好元素和对 象的绑定,Vue这个框架就会自动帮我们做好dom的相关操作 4.这种dom元素跟随JS对象值的变化而变化叫做单向数据绑定,如果JS对象的值也跟随着dom元素的值的变化而变化就叫做双向数据绑定
闭包是JS语言的又一大核心,如果要从内存角度充分理解闭包的话,建议大家先预习下先前的几篇讲博客: 稳扎稳打JavaScript(一)——作用域链 稳扎稳打JavaScript(二)——图解对象内存模型 稳扎稳打JavaScript(三)——创建对象的几种方式 什么是闭包 定义 闭包是一个能够访问其他函数作用域的函数。 这句话看似拗口,如果读过先前的几篇博客,那理解起来应该不难。下面来解析一下这句话: 首先,闭包是一个函数; 其次,这个函数不仅能访问自己的作用域,更为关键的是它还能访问其他函数的
if-else简化写法 代码中若出现多层if-else嵌套,代码就会显得臃肿不堪,这时可采用替代方案来浓缩代码。 常规写法:(臃肿不堪) if(){ if(){ //…… } else{ //…… } } else{ //…… } 简化写法:(一行搞定) (a) && (b) || (c); 上述表达式含义:若条件a为true则执行表达式b,否则执行表达式c。 原本多行的if-else语句一行就可以搞定。 此外,该句式支持多层
文章中涉及到的知识都是渐进式的讲解开发,当然如果对之间内容不感兴趣(已经了解),也可以直接切入本文内容,每一个章节都和之前不会有很强的耦合。
react中虚拟dom+jsx的设计一开始就有,vue则是演进过程中才出现的,2.0版本后出现。
一、vue通过$refs获取到dom对象(获得dom对象改变里面的内容) 模板: <button @click="getdata">获取dom对象</button> 这是一个div js: methods: { getdata: function() { //在这个方法中通过vue形式获取到div的对象,比js和jq都方便 console.log(this.$refs.mydiv); //改变div
如果一个页面中有十几个地方用到Ajax,那么我们需要写十几次open()、十几次send()、十几次获取xhr对象; 代码重复相当多,而凡是有代码重复的地方,就有封装的可能;
好多天前,领导让我实现一个树形图拖拽插件,这个插件用来描述各部门领导与员工之间的关系,每个父节点显示其子结点数量,拖拽任意一个叶结点上的人到另一个结点,他们之间的关系发生改变,树形图重新渲染。用户操作都完成后,点击保存根据树形图生成JSON,将JSON发送给后端,后端根据JSON修改数据库中的人员对应关系。
进入官方网站获取最新的版本 http://jquery.com/download/ ,这里需要注意 jQuery 分 2 个系列版本 1.x 与 2.x,主要的区别在于 2.x 不再兼容 IE6、7、8浏览器,这样做的目的是为了兼容移动端开发。由于减少了一些代码,使得该版本比 jQuery 1.x 更小、更快。
什么是jQuery?jQuery是一个快速、简洁的JavaScript库,其设计宗旨是“write less,do more”,倡导用更少的代码,做更多的事情。通过这段时间的学习,我感觉jQuery是一个“语法糖”,就像是包在糖果外面的包装,让js看起来更好看。
大家好,这里是「 Daotin的梦呓 」从零开始学 Web 系列教程。此文首发于「 Daotin的梦呓 」公众号,欢迎大家订阅关注。在这里我会从 Web 前端零基础开始,一步步学习 Web 相关的知识点,期间也会分享一些好玩的项目。现在就让我们一起进入 Web 前端学习的冒险之旅吧! 一、兼容代码 1、封装 innerText 和 TextContent // 设置任意标签的文本内容为任意内容 function setText(element, text) { (t
为了降低本文难度,构建工具选择了parcel,欢迎加入我们的前端交流群~ gitHub仓库源码地址和二维码都会在最后放出来~
state:组件函数或类的成员,render一次渲染,setstate调用后值有更新才会重新调用render preps: 虚拟dom的属性,preps输出属性,html端显示输入
JS与DOM的关系 浏览器有渲染html代码的功能,把html源码(如div,p标签等)在内存里形成一个DOM对象 文档对象模型DOM(Document Object Model)定义访问和处理HTM
浏览器环境: 是指 JS代码在浏览器中的运行时环境,它包括V8自动构建的对象(即ECMAScript的内容,如Date、Array),浏览器(内置)传递给V8的操作DOM和BOM的对象(如document、navigator);
jQuery 一.jQuery入门 1.javascript类库 JavaScript 库封装了很多预定义的对象和实用函数。能帮助使用者建立有高难度交互客户端页面, 并且兼容各大浏览器。 核心理念是w
ps:.offset()方法允许我们检索一个元素相对于文档(document)的当前位置,和 .position()的差别在于: .position()是相对于相对于父级元素的位移;
最近在搭建完善自己的博客,需要用到一些页面样式之类的,就特意问了一下女朋友一个问题,关于Web前端开发,jQuery现在过时了嘛?她毅然决然告诉我,那是我们前端现在的鄙视链。是的,不可否认,现在框架盛行,jQuery早已被GitHub所遗弃。我依稀记得,两年前,我学前端知识,觉得这个框架真的很好,以后有时间,一定要好好学一下它。也就这么点时间,它早已淡出了前端开发者的视线。不过呢,我身为后端开发,也就是一个新人于前端来说,所以我还是很喜欢jQuery的思想,因为让我直接理解Vue/React的话,还是需要大量时间的,所以认为jQuery是一个不错的过渡选择,也可以学习下前端编程思想,我看中了它的人性化以及可读性很强,对于我们来说也很简单,所以本文带大家一起回忆那些jQuery的点点滴滴,也为我们前端知识打个牢固的技术基础。
领取专属 10元无门槛券
手把手带您无忧上云