
前端野旅(jquery)
一个做了7年的C/S WPF应用程序员 的前端旅程
小慧哥
先立志成为海贼王里的派大星
展开
-
JQuery22( JQ原理 Clone)
克隆需要看我上篇博客JQuery21 事件的构成 才能理解 深克隆的方法深克隆 比浅克隆 能复制事件浅复制可以使用原生JS CloneNode(true) 就可以了 返回值 做一个集合 return 浅复制结束那么深复制就比较麻烦 深复制就是需要遍历出 事件属性里的事件对象中的function 循环注册到这里位置 原理结束 明天开始进行ajax 加油了代码...原创 2019-09-02 16:42:43 · 1921 阅读 · 0 评论 -
JQuery21( JQ原理 事件 on off)
今天下午 日本那边又出幺蛾子 对日的兄弟应该都能理解 日本那边可能和国情有关 大部分都是一些老年的客户 感觉做什么都很没有节奏 很费劲 浪费了好长时间 当时也要按计划 更新事件原理 稍微有一些复杂主要问题是新旧版本 如果执行同一个button 多次注册一个事件 不同函数 会调用顺序不同 这里简单做了一个分解IE9以上:addEventListenerIE8和Ie8以下 用a...原创 2019-08-30 16:56:04 · 387 阅读 · 1 评论 -
JQuery20( JQ原理,属性 Prop 和 对CSS增删value的处理原理)
1)Prop 就是对应标签自带属性进行操作 attr 是对自定义操作2)CSS 和value 主要是对对象style 和value的操作3)对CSS操作主要是className 的一些操作代码都很简单这里 单独出一个 分解 Hasclass的代码 在后面就给出所有的操作 基本功能都有(今天下午 在做几个事件 原理 JQ的原理就结束了 再...原创 2019-08-30 11:31:37 · 269 阅读 · 0 评论 -
JQuery19( JQ原理 属性 attr)
我们今天说一下Attr 属性的实现原理 后面如果有重点内容 我会单独拿出来 如果没有 就直接贴代码 因为注释 我都会写在代码里分解一下attr 的功能// $('div').attr('class')获得第一个查到的DIV的class的值 返回值是CLass// $('div').attr('class','ess') 全部的class 设置成ess 返回值是对象// $ $(...原创 2019-08-28 16:53:06 · 417 阅读 · 0 评论 -
JQuery18(JQ原理 DOM元素 appendTo append prepend prependTo InsertBefore Before JReplaceAll)
最近工作比较多 Jq 原理 也做到操作DOM阶段 JS还是不熟悉 理解的比较多 所以 才更新出博客然后自己写了基本这个几个DOM 实现了一个 剩下的基本就很快 都是一套流程 注释和分解都写在代码里写一篇开始写JQ操作属性的方法实现原理 appendTo:function(str) { //转成成核心对象 不然 还要对各种类型转换 v...原创 2019-08-28 14:37:56 · 1065 阅读 · 0 评论 -
JQuery17(阶段代码 JQ each map empty等实现原理)
这些都是基本原理 直接贴 自己写的现阶段代码上面有注意点的我都写了注释 最近理解的东西比较多 不懂的也多 有点累 自己写的JQ代码明天好好休息(function(window,undefined){ var NjQuery = function(selector) { return new NjQuery.prototype.init(selecto...原创 2019-08-24 16:49:26 · 318 阅读 · 0 评论 -
JQuery16(真伪数组转换 和入口函数)
1)真伪数组转换真伪数组的意思不在解释了很简单 真数组就是array 对象的 都是伪数组那么我们怎么区分真伪数组?1)真数组长度可变2)伪数组不可以变3)真数组可以使用数组方法 伪数组不可以 比如((.forEach))我们先做真数组转伪数组 var temp1=[1,2,4,4,5,6,7]; var obj1={}; [...原创 2019-08-23 16:49:07 · 3838 阅读 · 0 评论 -
JQuery15(Jq原理 方法分类)
方法分类 算是一个技术点 这个能解决 如果编写一个类的时候 里面的方法很多 就会很难维护 那么怎么处理能让代码更好阅读 更好的维护那?栗子: JQ里有很判断方法比如isObject.isArrayisString 等等NjQuery.isString=function(str){return typeof str=="string";}NjQuery.isHtml=fu...原创 2019-08-23 13:41:20 · 1810 阅读 · 0 评论 -
JQuery14(Jq原理 封装)
想了解一下Jq函数的实现原理 顺便对JS一些知识回顾 比用JQ吃力一些理解的也不是很深 等看完所有的Jq 做一个播放器 来加深理解 看看和现在的理解有什么出入这个就是Jq的封装函数分解解释一下下面代码(function(window,undefined){ var NjQuery = function(selector) { return new NjQu...原创 2019-08-23 13:08:55 · 624 阅读 · 0 评论 -
jquery语法学习13(标签操作方法)
对标签的操作1)append 标签后面增加标签(内部)2)prepend标签前面增加标签(内部)3)after 标签外部后面增加标签(同级)4)before标签外部前面增加标签(同级)5)remover() 删除指定节点6)empty(); 删除指定节点的子项 指定节点保留7)replaceWith 替换元素8)clone(false) 浅复制 只复制...原创 2019-08-19 16:52:19 · 190 阅读 · 0 评论 -
jquery语法学习12(淡入淡出动画 自定义动画 停止动画)
1)淡入淡出动画 1.fadeIn 淡显动画 2.fadeOut 淡隐动画 3.fadeToggle 动画切换 4.fadeTo 淡显到下面是代码 这里注意一下 动画里能做动画效果<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"&g...原创 2019-08-14 16:42:08 · 596 阅读 · 0 评论 -
jquery语法学习11(基本动画 显示和折叠 )
1) show 和hide没什么可说 直接上代码 就是显示和收回知识点:$("html,body")// 逗号分隔开的两个条件的分别选出来的范围求并集,然后 前后部分没有任何关联。 $("html,body").scrollTop()获得窗体滚动条 滚动多少<!DOCTYPE html><html lang="en"><...原创 2019-08-13 16:49:48 · 222 阅读 · 0 评论 -
jquery语法学习10(hover siblings)
1)hover(function(){},function(){})鼠标移入移出 推荐用这个 等于mouseentermouseleave <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta ...原创 2019-08-12 16:42:05 · 336 阅读 · 0 评论 -
jquery语法学习09(Event事件 绑定 解绑,冒泡事件 ,自动触发事件,自定义事件,委托)
1)事件的绑定 解绑绑定方法: 1 使用eventname(function)//确定支持的事件太少 2 on(eventname,function)// 编写稍微麻烦事件解绑:off<!DOCTYPE html><html lang="en"><head> <meta charset...原创 2019-08-10 16:52:43 · 266 阅读 · 0 评论 -
jquery语法学习08(给标签动态增加CSS样式、动态给增加标签和文本还有值 、 offset、innerwidth、outerwidth、scrollTop)
这里主要讲innerwidth 喊outerwidth的含义1) addclass 来给标签增加写好的类样式 removeClass 能增加就能删除 toggleClass 这个切换很有意思 样式之间可以动态切换<!DOCTYPE html><html lang="en"><head> ...原创 2019-08-09 16:14:45 · 1402 阅读 · 0 评论 -
jquery语法学习07(attr和prop)
首先我们得了解什么是属性和属性节点~1)属性和属性节点?什么是属性?什么是属性节点function Per(){};//类var er = new Per(); //new一个对象er.name='二麻' //name就是属性er['name']=‘二麻’//第二种方式<span name ='oscar'></span>// HTML 标签里na...原创 2019-08-08 15:33:44 · 182 阅读 · 0 评论 -
jquery语法06(选择器下半部)
这里列举了 属性选择器 和attr的用法 还有子元素的用法依然是死记硬背 直接粘代码1)属性选择器 与attr的用法<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width...原创 2019-08-07 16:47:25 · 171 阅读 · 0 评论 -
jquery语法学习05(选择器上半部分)
这里参考了http://hemin.cn/jq/index.html 写的各种实例 都很详细这个都是语法 没什么可以理解的 死记硬背就好 粘代码了<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport...原创 2019-08-07 14:56:41 · 214 阅读 · 0 评论 -
jquery语法学习04((function(){})()概念与一些静态函数的用法)
快下班了快下班了快下班了快下班了快下班了快下班了快下班了快下班了快下班了快下班了快下班了快下班了快下班了快下班了1)var 变量=$.trim(参数); 去掉左右空格2)var 变量=$.isArray(参数); 是不是数组;3)var 变量=$.isWindow(参数); 是不是window对象4)var 变量=$.isFunction(参数); 是不是一个函数对象上...原创 2019-08-06 16:28:25 · 243 阅读 · 0 评论 -
jquery语法学习03(循环 each,map用法)
首先 需要了解 一个概念 什么叫伪数组正常的数组 var array=[1,3,4,5,6]; OK吧~ 没问题吧~伪数组 典型的栗子:function里的arguments 还有JQuery查询的返回参数 都是伪数组定义:伪数组的定义是从0 开始 到 length-1 并有length 属性比如var arraylist= [1,3,5,6,7,9]; //数组va...原创 2019-08-06 15:53:22 · 731 阅读 · 0 评论 -
jquery语法学习02(prototype funciton函数 New与直接调用理解)
这篇来针对俩个问题 进行现阶段总结理解prototype 建议看一下<javascript高级程序设计三>的 第6章1)prototype 是什么玩意我认为prototype 原型~ 就是实现共用 参数或者 默认参数 可以用举个栗子function ClassA(){ ClassA.prototype.name='xiaoming'; ClassA...原创 2019-08-06 13:49:02 · 438 阅读 · 1 评论 -
jquery语法学习01(零散基础)
今天开始学习JQ总结一下 (比较枯燥的基础总结 这些可以看视频或者菜鸟教程的 更全面一些 文后有几个问题总结 我认为比较重要)1)JQ是封装好的Javascript2)JQ会等DOM加载完毕 不会等图片加载;原生态JS会等图片和DOM同时加载完毕(同时 去过得另一个网页的图片时 JS可以获取 JQ 就不可以 一个概念 留意就行 JQ和JS还是有区别的)3)JQ的写法(写的越少 做的...原创 2019-08-06 13:16:30 · 321 阅读 · 0 评论 -
前端野旅—开篇
首先介绍我一下自己生在大连 学在北京 当初看着北爱 听着JAY的歌 在北京四年也算北漂了 背井离乡 工作的时候 住没有窗户的公寓 也算大大小小的困难都体验过了 一直学着C/S 方向的技术 痴迷WPF 带来的当时跨时代的 界面体验 觉得 这就是趋势 后来也专注这方面的开发在2015年回到大连后 发现 这个曾经的大连变得体无完肤~ 咱们普通老百姓也说不了啥 也不...原创 2019-08-05 11:07:04 · 201 阅读 · 0 评论 -
自己实现JQ的源码 (冥冥之中感觉以后会用到 留一个在博客里)
(function(window,undefined){ var NjQuery = function(selector) { return new NjQuery.prototype.init(selector); } NjQuery.prototype= { constructor:NjQuery, ini...原创 2019-09-26 16:47:39 · 268 阅读 · 0 评论