javascript
文章平均质量分 93
小疯疯0413
因为代码可以改变世界,所以我从未放弃
展开
-
群友提问,终于解决
今天我仁问我一段代码如何写,我看了看,是一个外卖网页,大家肯定都订过外卖,在买很多菜品的时候后面有一个加号的按钮来实现订购数量增多,如果一次订很多,那便有多个按钮,他的问题是他点击一个按钮所有菜的数量都加1,这怎么整呢,我一开始也想了很多,肯定是用this指向当前点击的按钮,但是如何实现对应input标签里value的数量增加1呢,我想了好久也没有思路,最后经过我流浪哥的指点总算是做出来了!!下面我原创 2015-06-20 09:03:37 · 596 阅读 · 0 评论 -
固定滚动JS源码
HTML和CSS部分<!DOCTYPE html><head> <meta charset="UTF-8"> <link rel="stylesheet" type="text/css" href="style.css"> <script type="text/javascript" src="base.js"></script> <title>固定滚动</titl原创 2015-08-18 11:39:33 · 703 阅读 · 0 评论 -
JS动画封装
简单的运动函数var demo1=document.getElementById("demo1"); demo1.onmouseover=function(){ startMove(0); } demo1.onmouseout=function(){ startMove(-320); }var timer//全局变量function原创 2015-08-19 09:21:09 · 669 阅读 · 0 评论 -
编写高质量代码(7)
Javascript分层概念 分为3层 base层,最底层,有两个功能一个是用来兼容浏览器,第二是扩展js接口,提供一些更方便的接口 common层 依赖于base层接口,提供可复用的组件,是典型MVC模式里的 M 和页面内的具体功能没什么关系,功能是给page层提供组件 page层,三层最顶层,和页面的具体功能直接相关,是MVC里的C 依赖于前两个层,page层的功能是完成页面功能需求原创 2015-09-08 20:57:47 · 344 阅读 · 0 评论 -
编写高质量代码(5)
这篇笔记正式进入javascript,先总结下,看了这本书对javascript的理解,感觉我对javascript的理解更上了一层楼,不止是技术上,更多的在技巧上,我发现我对javascript的封装理解还是有一些问题,在这方面这本书教了很多,所以强烈推荐读到我文章的人,可以自己看一下这本书《编写高质量代码-Web前端开发修炼之道》,并不是搞推销,这也是我博客里至今唯一推荐的一本书,真的好看如果是原创 2015-09-04 14:45:40 · 563 阅读 · 0 评论 -
编写高质量代码(6)
我们一般写JS代码时一般都是window.onload=function(){ }这是在HTML页面DOM元素加载完毕在执行其中的内容,这样可以避免我们执行JS的时候DOM结构还没有加载导致错误的情况,这么写的确没什么问题,但是我们可以更加优化这类问题,试想下,如果我们的网站有大量图片和FLASH,这样加载时间会非常的长,而我们希望JS在DOM节点存在就可以使用,而不在乎是否节点内容加载完毕,原创 2015-09-04 21:43:58 · 533 阅读 · 0 评论 -
JS 原型理解
原型是js里非常重要的一个概念,很多更高级的概念需要有原型的基础,类似于,我们js里的继承,原型就是其中一种实现方式,还有通过原型模式创建对象等等,这都需要原型基础,这里主要通过Chorme的调试器,来看看到底原型和对象到底是什么。首先我们先写一些测试用的代码function Person(){ var name = 'qfy'; var password = '123'}fun原创 2016-12-03 21:20:22 · 482 阅读 · 0 评论 -
JS之property和attribute
我第一次看到这两个的时候也没有太注意他们之间的区别,但直到有一天,我发现我不能再把这两个东西混为一谈了,我一定要整清楚到底是怎么回事,于是乎去了ECMA文档里查了查,在这里附上网址 http://www.ecma-international.org/ecma-262/6.0/#sec-call 是英文的文档,勉强看的懂,如果有哪里不对,希望大神们指正。property(属性)我个人翻译成原创 2017-01-03 14:25:43 · 6559 阅读 · 0 评论 -
搞懂js继承方法
js实现继承,都是些老生常谈的问题了,网上文章很多,但不动手敲一敲,还是没有那种深入的理解,所以写篇日记记一下自己对继承的理解,如果顺便能帮到大家理解如何继承那是再好不过的了。最近也好久没写文章了,以后一定要经常写,来巩固自己的知识。首先思考下,什么是继承,也就是我子元素能用父元素的方法,那该如何实现呢,我们都知道js中有原型这东西,当我们new一个对象的时候,new出来的对象就会有prototyp原创 2017-04-23 13:34:53 · 1692 阅读 · 0 评论 -
Zepto.js之一步步看源码(一)
最近博主再看zepto.js的源码,zepto.js相较起来比较简短,适合第一次读源码,主要是怕以后忘记,就写下笔记来记录这次源码之旅,总体来说收获还是挺大的。zepto.js就类似于一个迷你的jquery,直接来就仔细来看看这源码怎么回事,我用的版本是Zepto v1.1.6首先我们看下总体结构var Zepto = (function() { return $})()window.Ze原创 2017-06-24 15:28:46 · 2849 阅读 · 0 评论 -
Zepto.js 之一步一步看源码(二)
上文我们说到的zepto的结构,这次我们就看一下zepto如何封装我们常用的方法的。通过学习别人封装的方法,对自己也是一种提升首先,我们所有返回的dom对象,所有的方法都封装在了源码中的$.fn中,dom对象是通过原型继承来实现继承$.fn中的方法,我们看一些我们常用的方法是如何封装的map: function(fn){ //这里要通过$封装一下,这样才能继续调用后面的方法,实现连缀功能。原创 2017-07-08 15:34:44 · 493 阅读 · 0 评论 -
手风琴JS特效源码
HTML和CSS部分<!DOCTYPE html> <head> <meta charset="UTF-8"> <link rel="stylesheet" type="text/css" href="style.css"> <script type="text/javascript" src="base.js"></script>原创 2015-08-18 11:21:43 · 2680 阅读 · 0 评论 -
最近用到的一些封装函数~
根据classname获取元素function getElementsByClassName(obj, cls){ var elements=obj.getElementsByTagName("*"); var result=[]; for(var i=0;i<elements.length;i++){ if(elements[i].className==cl原创 2015-08-18 11:13:32 · 679 阅读 · 0 评论 -
JQ DOM操作
今天开始学习李炎恢老师JQ视频中有关DOM操作的相关方法,在此记录下学习过程,以便日后回来复习! 首先是一些对元素内容的操作,大体分为3个方法 html(),text(),val()这三个方法再不传参数的时候分别是获取html内容,但他们之间是有区别的, 首先先说html()方法和text()方法的区别,text是获取的文本内容,会自动html标签,当然如果传入参数的时候呢text方法不会转义原创 2015-06-22 09:07:37 · 1171 阅读 · 0 评论 -
正则表达式一
工欲善其事,必先利其器,JQ源码中充斥的大量的正则表达式,我准备根据李炎恢老师的正则表达式的讲解, 写一篇有关正则表达式的笔记!不墨迹,直接进入正题!ECMAScript 的 RegExp 类 表示正则表达式 正则表达式在JQ中被大量运用,主要是为了检索字符串,进行匹配 创建正则表达式var box=new RegExp('box');//当然后面还可以传入一个参数,是用来确定修饰正则验证时原创 2015-06-30 16:08:44 · 435 阅读 · 0 评论 -
文字滚动JS代码
文字滚动特效,还是比较简单的只要弄明白远离,主要是定时器的使用,今天在慕课上看到一个比较好的,滚动好写只要实现scrollTop++就可以,难点在于怎么样实现无限滚动,要理解两个属性就是scrollTop和 scrollHeight 我们先复制一个ul列表和第一个列表一模一样,之后我们当第二个ul列表出现下面这样的情况时,将scrollTop变为0 这样也就是area.scrollTo原创 2015-08-01 12:11:32 · 3918 阅读 · 1 评论 -
JS原生瀑布流
今天早起看了慕课的瀑布流,的确讲的十分详细,也十分的好,我在博客里也就只能给代码加些注释,和说一下思路。建议大家去看一下慕课的瀑布流教程,非常详细,每一个细节都讲的非常好,只要懂JS的基础代码,看起来应该不是多大问题,里面没有太难得方法,但自己写不出来还是因为思路上有问题,下面就详细说一下几个重点方法的代码,建议大家去慕课详细学习 HTML 和CSS没有太难得地方<div id="main">//原创 2015-07-31 11:10:36 · 1748 阅读 · 0 评论 -
连缀功能
一下都是我自己对代码的理解,但也是我自身也是弱菜一枚,很多地方可能理解有错,也希望大神们帮我指正。。我也会定期发错误总结写成博客!所用代码为李炎恢老师博客前端代码!!!! $().getId(‘box’).css(‘color’, ‘red’).html(‘标题’).click(function(){alert(‘a’)});这段代码就是连缀功能。。很多人第一反正肯定是觉得很直观,清楚明了简洁原创 2015-06-13 13:47:24 · 754 阅读 · 2 评论 -
今天呢遇到了群友的提问呢!!我自己也蒙了
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> #div1{width: 100px;height: 100px;border: 1px solid black;} #di原创 2015-06-18 22:54:59 · 480 阅读 · 0 评论 -
JS原生轮播(JS篇)
接着上一篇,我接下来写关于JS的部分,我会按照我当时的思路一步一步的写,在最后附上全部的代码 一开始我打算写最简单的图片切换功能,怎么写呢?当我们点击左右箭头的时候是用改变left的值,有了思路就很好写了 //首先我们要获取我们需要的属性和id var prev=document.getElementById("prev"); var next=document.getElem原创 2015-07-28 11:31:49 · 7010 阅读 · 0 评论 -
商城导航
最近一直都在看慕课,看见些有意思的小特效也就在这记一下,今天看的是一款京东商城导航的,大体一看并不难,无论是C单一SS还是单一JS都不需要太多的逻辑,所以打算在这里记下来 先说一下CSS方面吧,很简单,主要是一些hover的应用,对CSS理解深一点的人大体都可以写出来,但 里面的一些小特效,小技巧还是让我眼前一亮,还是蛮有意思的,这次代码里还用的dl dt dd我以前几乎不用,看了视频后也是更多原创 2015-07-30 11:41:55 · 556 阅读 · 0 评论 -
this call() apply()理解
今天根据大神的讲解,我来总结一下最近有关JS的一些问题 首先是this问题,一直困扰着我。今天看了大神的文章我先记下我的理解 this 就是函数据以执行的环境对象。。。 首先是一个例子var point={x : 0,y : 0,moveTo:function( x , y ){this.x =x;this.y =y;}}这个函数是被封装在对象里的,没有直接调用,而是通过poin原创 2015-07-27 08:28:58 · 447 阅读 · 0 评论 -
遮罩层特效,登录界面的应用
今天上午的自己写了下遮罩层,和登陆界面的关闭,总之都是很简单的JS代码,我因为思路问题,所以敲了好长时间,最后再群友的帮助下完成了今天的任务,下午可能还会更新一章,具体什么,还没想好 先写一下写遮罩层的思路吧 首先遮罩层嘛,经过群友的意见,有2种写法,一种是CSS设置宽高,一种是JS设置宽高,总的来说,css比较简单 这两个版本代码差距很少,几乎没大有,不过还是列出来看看//最核心的代码其实就原创 2015-07-29 10:29:02 · 1227 阅读 · 0 评论 -
electron实现桌面端隐藏到托盘
最近学习了下electron,需要实现一个托盘功能,下面是我的实现,如果有更好的实现方法,希望大佬指正下 下面是项目地址:码云项目地址 我们首先要了解一下托盘功能,只有了解了托盘才能更好地写代码实现它。 1.首先我们需要我们的的桌面程序在右下角也就是系统通知区添加图标和上下文菜单,这部分我们可以用Tray部分的API实现:官网Tray方面的API 2.其次我们现在可以实现下方系统通知区的功...原创 2018-07-07 15:25:33 · 17978 阅读 · 10 评论