自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(41)
  • 资源 (1)
  • 收藏
  • 关注

原创 父元素flex布局,子元素宽度问题

关于父元素flex布局,子元素宽度如何不扩展父元素的问题@TOC碰到的问题如标题所示父元素flex布局,子元素包含左右两个,左边固定宽度,右边子元素宽度过宽拉伸了父元素的问题,而我不希望页面延伸出去。解决办法:子元素绝对定位加宽度固定:position: absolute;width: 100%;当时一直不知道怎么解决,试了很多网上的方法,例如,flex-shrink,但是我碰到的项...

2019-08-01 22:39:44 3557

原创 前端技术发展概述——拓展

关于目前自己所知道的前端尚未普及、发展前景较好的一些技术的更新及概述,时刻了解新技术、学习新技术。 1、PWA 这个目前在国外已经比较普及,国内实现较少。 详情请戳:下一代webApp—-PWA 饿了么PWA开发实践2、GraghQL 首先入门了解,可以看官网 与其他前后端接口的对比:RESTful VS Gra...

2018-10-29 16:05:42 513

原创 从输入URL到页面加载完成的过程(全程梳理)

看了别人的文章,更改删除了部分内容,以适应自己的学习需要,非常感谢撒网要见鱼的分享。----------------------------------------------------------------------------------------------------------------------------2018.8.2 第二次看,把自己以前看过的博客都整理进来,...

2018-10-29 16:04:36 10089 1

原创 JS设计模式与开发实践

最近开始看曾探的《JavaScript设计模式与开发实践》一书,仅以此篇博客记录学习内容。设计模式的定义是:在面向对象软件设计过程中针对特定问题的简洁而优雅的解决方案。通俗一点说,设计模式是在某种场合下针对某个问题的一种解决方案,给面向对象软件开发中的一些好的设计取个名字。从某些角度来看,设计模式确实有可能带来代码量的增加,或许也会把系统的逻辑搞得更复杂。但软件开发的成本并非全部在开发...

2018-09-01 13:34:12 1775

原创 vue源码学习——综述

以前也断断续续看过一些关于vue源码的文章,但是都不够完整或者说系统,对源码的理解也一直是囫囵吞枣的状态。最近尤大大在微博分享了两个学习源码的链接,我觉得有必要听从大神的安排来整理一波知识点了。 大神分享的两个链接如下: Vue技术内幕 Vue技术揭秘 个人学习版本2.5.17,按照上面两篇文章来写,为了加深自己的记忆而已。源码目录说明首先自行去Github上下载Vue的源...

2018-08-20 22:39:11 1128

原创 使用jQuery写插件

jQuery一直在用,但是却没有自己写过插件,看了几篇博客,想整理一下。jQuery编写插件的方式: 接下来分别举例介绍它们:1、类级别的静态开发就是给jQuery添加静态方法。首先创建classDev.js文件,//1、直接给jQuery添加全局函数jQuery.myAlert1 = function(str1){ alert(str1);};//2、使用e...

2018-08-17 11:59:39 294

原创 华为笔试题

今晚刚笔试完,关于其中第三题,个人认为应该使用正则表达式解决,当然我做题老是超级费时间,所以当时没做出来,一直出错,现在自己找出了错误,将通过的代码记录一下,另外警醒自己写代码少犯错。关于match函数的用法也不熟练,输出结果是所有匹配项,这个一开始就错了。题目具体说不全面了,说大致要求: * +代表加法、*代表乘法、^代表自增; * 要求括号匹配;运算符和数字之间以空格隔开;数字...

2018-08-15 23:39:04 445

原创 学习JavaScript数据结构和算法(部分四)

看了 Loiane Groner 著的《学习JavaScript数据结构与算法》一书,自己写篇博客对着敲敲代码: 全文包含十个部分,分别是:数组、栈、队列、链表、集合、字典与散列表、树、图、排序和搜索算法、算法补充知识。知识点其他部分参考:7、图...

2018-08-14 11:22:47 556

原创 学习JavaScript数据结构和算法(部分三)

看了 Loiane Groner 著的《学习JavaScript数据结构与算法》一书,自己写篇博客对着敲敲代码: 全文包含十个部分,分别是:数组、栈、队列、链表、集合、字典与散列表、树、图、排序和搜索算法、算法补充知识。知识点第一部分请参考: 知识点第二部分请参考: 接下来学习第三部分:7、树到目前为止,介绍了一些顺序数据结构(例如:数组、队列、链表等),介绍的第一个非顺序...

2018-08-13 23:48:31 2699 1

原创 学习JavaScript数据结构和算法(部分二)

看了 Loiane Groner 著的《学习JavaScript数据结构与算法》一书,自己写篇博客对着敲敲代码: 全文包含十个部分,分别是:数组、栈、队列、链表、集合、字典与散列表、树、图、排序和搜索算法、算法补充知识。知识点第一部分请参考: 接下来学习第二部分:6、字典和散列表集合、字典和散列表可以存储不重复的值。在集合中,以[值,值]的形式存储元素,我们感兴趣的是每个值的...

2018-08-09 15:48:11 813

原创 学习JavaScript数据结构和算法(部分一)

看了 Loiane Groner 著的《学习JavaScript数据结构与算法》一书,自己写篇博客对着敲敲代码: 全文包含十个部分,分别是:数组、栈、队列、链表、集合、字典与散列表、树、图、排序和搜索算法、算法补充知识。面向对象编程JavaScript里的对象就是普通名值对的集合。创建一个普通对象有两种方式。第一种方式是:var obj = new Object();第二种方...

2018-08-08 15:51:46 2156 1

原创 十大排序算法---javaScript详解

八大常用排序算法详细分析,包括复杂度,原理实现如下:光看这张表格肯定记不住,要了解原理。先看看复杂度的计算方法:常用算法时间复杂度的计算。算法稳定的含义: 排序算法的稳定性通俗地讲就是能保证排序前2个相等的数其在序列的前后位置顺序和排序后它们两个的前后位置顺序相同。在简单形式化一下,如果Ai = Aj,Ai原来在位置前,排序后Ai还是要在Aj位置前。算法稳定的好处:排序算法如果是稳...

2018-08-06 01:43:42 451 1

原创 从浏览器多进程到JS单线程

最近在重看从输入URL到页面加载完成的过程,发现里面很多知识点自己当时学的很杂乱,浅显,现在属于对其中细节知识点的梳理,帮助自己加深记忆理解。(当时写那篇博客还不知道格式,写的脑壳痛,现在用markdown,可以解决很多格式问题,强烈打call)一、区分进程和线程1、二者的类比关系 — 进程是一个工厂,工厂有它的独立资源,不同的工厂之间相互独立; — 线程是工厂中的工人,多个工人协作完...

2018-08-01 20:33:57 539

原创 MYSQL(5.6.41)安装及其问题

1、安装起始安装过程,网上教程一大把,可以随便找个,去官网下载。下载好了后,以管理员身份打开命令行,进入mysql安装的bin路径,运行net start mysql,会发生错误:mysql 服务无法启动. 发生系统错误 1067。 关于这个的解决方案,网上一搜有很多,我最后参照的解决方案是: https://www.cnblogs.com/yfceshi/p/6897668.html这篇...

2018-07-31 23:46:08 3901 1

原创 监控网页的卡顿与崩溃

1、chrome开发者工具-Performance面板chrome浏览器右键检查元素即可打开谷歌开发者工具面板,但是常用的可能是Element、Console、Source三个面板的功能,其余面板还有:Network、Performance、Memory、Application、Security、Audits等。 这些按钮的功能如下: * Elements: 查找网页源代码HTML中的...

2018-07-31 16:09:01 3543

原创 Vue项目中引入SVG插件

一、SVG定义SVG全称是Scalable Vector Graphics,即可伸缩矢量图,用于描述二维矢量图形的图形格式。在web中使用SVG可以解决位图放大失真的问题。首先,不要把SVG和CSS、Canvas、HTML搞混,他们之间并没有关系。简单的理解,它是图形的另一种格式,例如它和常见的图片格式.png、.jpg、.gif等是一类。 SVG是通过XML的形式写在HTML文档中的。SV...

2018-07-26 23:59:25 6979

原创 浮动的出现以及清除方式

一、为什么出现浮动?我们先说说CSS中的定位机制:普通流、浮动、绝对定位(其中"position:fixed"是"position:absolute"的一个子类)。1、普通流:  normal flow,或者称之为常规流。除非专门制定,否则所有框都在普通流中定位。普通流中元素框的位置有元素在HTML中的位置决定。块级元素从上到下依次排列,框之间的垂直距离由框的垂直margin计算得到。行内...

2018-07-20 20:37:25 280

原创 js程序设计题-包括轮播图的设计

一、运算function add(m){return function b(n){ return n+m++}}var add1 = add(070);var add2 = add(050);console.log(add1(010)); //64console.log(add2(010)); //48解析:1、js在数值传...

2018-07-11 17:15:45 1920

原创 利用@keyframes规则设计loading加载样式

最近在学习github上一个开源项目,以前做的项目小,从没考虑过loading样式问题,下面记录一下,利用@keyframes进行div元素的移动。实现loading的样式自己把项目中的代码组合了出来,记录一下:<html><head><title>Loading加载样式</title><style> body { posit...

2018-07-04 23:47:53 1241

原创 一个满屏品字布局如何设计

代码:<html><head></head><body><div class="first"> <div class="up"></div></div><div class="second"&am

2018-06-21 17:11:11 888

原创 iframe详解

        以前看东西马虎,知道iframe可用于跨域,常用于广告,但是对其它就知之甚少,今天看了一篇博客,觉得分析十分详细,转载过来。原文出处:前端之iframe详解iframe基本内涵通常我们使用iframe直接直接在页面嵌套iframe标签指定src就可以了。<iframe src="demo_iframe_sandbox.htm"></iframe>但是,有追求...

2018-06-21 16:00:09 1638

原创 vue新建项目报错

才几个月没接触vue,好像就生疏了,新建项目都会报错,先记录一下:在npm install的时候报错:Unexpected end of JSON input while parsing near '...kwrap":false,"publish'解决方案:先:npm config set registry http://registry.cnpmjs.org                  ...

2018-06-08 22:55:44 977

原创 jQuery源码分析(14)-DOM操作图示

其中,分析的2.0.3版本并没有jQuery.clean()函数,但是domManip()函数中由html字符串转化为DOM结构的过程与clean函数的处理过程类似,所以可以借鉴一下。来源:http://www.cnblogs.com/nuysoft/archive/2012/01/10/2318204.html...

2018-05-28 23:29:08 122

原创 jQuery源码分析(13)-事件绑定(2)

针对事件处理,我们可以拆分2部分:一个事件预绑定期一个事件执行期一、事件预绑定期1、jQuery.fn.on函数

2018-05-26 22:03:22 325

原创 jQuery源码学习(12)-事件绑定(1)

1、javaScript传统的事件处理给某一个元素绑定了一个点击事件,传入一个回调句柄处理:element.addEventListener('click',doSomething,false);但是如果页面上有几百个元素需要绑定,那需要绑定几百次,这样就可以知道传统绑定方法存在的问题:大量的事件绑定,性能消耗,而且还需要解绑(IE会泄漏);绑定的元素必须要存在;后期生成的HTML会没有事件绑定,...

2018-05-26 19:53:37 217

原创 jQuery源码学习(11)-属性方法解析和钩子hook

1、jQuery提供了一些快捷函数来对dom对象的属性进行存取操作。实例方法有:jQuery.fn.extend({ attr removeAttr prop removeprop addClass removeClass toggleClass hasClass val});静态方法有:jQuery.extend({ ...

2018-05-22 22:41:52 407

原创 jQuery源码学习(10)-回溯end()和addBack()

1、问题发现:父元素ul,嵌套了li节点, 我们现给li绑定一个事件:<ul id="aaron"> parent <li>child</li></ul>这个很简单找到ul下面的li,绑定即可:var aaron = $("#aaron"); aaron.find('li').click(function(){ ...

2018-05-21 23:22:15 182

原创 jQuery源码学习(9)-数据缓存

jQuery中有三种添加数据的方法,$().attr()、$().prop()、$().data()。但是前面两种是用来在元素上添加属性的,只适合少量的数据,比如:title,class,name等。对于json这种数据量大的,就适合用data方法来添加,而data方法就是jQuery缓存机制最重要的方法。1、历史背景:        jQuery从1.2.3版本引入数据缓存系统,主要的原因是最初...

2018-05-21 00:11:24 191

原创 jQuery源码学习(8)-Deferred

1、问题提出        JavaScript编程几乎总是伴随着异步操作,传统的异步操作会在操作完成之后,使用回调函数传回结果,而回调函数中则包含了后续的工作。这也是造成异步编程困难的主要原因:我们一直习惯于“线性”地编写代码逻辑,但是大量异步操作所带来的回调函数,会把我们的算法分解地支离破碎。此时我们不能用if来实现逻辑分支,也不能用while/for/do来实现循环,更不用提异步操作之间的组...

2018-05-20 21:35:14 117

原创 jQuery源码学习(7)-Callbacks

jQuery.Callbacks()是在版本1.7中新加入的。它是一个多用途的回调函数列表对象,提供了一种强大的方法来管理回调函数队列。

2018-05-18 23:41:09 198

原创 jQuery源码学习(6)-Sizzle选择器(2)

1、CSS选择器的位置关系:四种关系:"+" 紧挨着的兄弟关系;">" 父子关系;" " 祖先关系;"~" 之后的所有兄弟关系  <div id="grandfather"> <div id="father"> <div id="child1"><

2018-05-17 01:06:30 355

原创 jQuery源码学习(5)-Sizzle选择器(1)

1、常见的选择器:#test表示id为test的DOM节点.aaron 表示class为aaron的DOM节点nav>li 表示在nav内部子li的样式,而不是所有的后代元素,只是往下一层li的样式。nav+p 表示nav类相邻的p元素的属性,其他的p元素不受影响。nav[title] 表示nav的title属性的样式。nav[rel='active'] 表示nav类的属性rel为activ...

2018-05-16 01:19:10 813

原创 jQuery源码学习(4)-变量解析及工具函数

点开jQuery的核心代码,可以看到其前面定义的很多变量都由正则表达式赋值(觉得想出那么难的正则表达式,都是反人类的存在),这也是我在jQuery学习中插入正则表达式学习的目的:对正则表达式感兴趣的可以前往...

2018-05-15 21:09:07 408

原创 jQuery源码学习(3)-构造jQuery对象

1、源码结构先看总体结构,再做分解:(function( window, undefined ) {      // 构建jQuery对象    //在jQuery原型中定义init这个工厂方法,用于jQuery对象的实例化,是为了避免用jQuery自身实例化的时候造成死循环。    //init放入原型中,是因为实例this只与原型有关系            // jQuery框架分隔作用域的...

2018-05-14 23:49:17 521 2

原创 jQuery源码学习(2)-正则表达式

由于jQuery源码中涉及到大量正则表达式,可以写篇博客整理正则表达式。1、语法1.1定义正则表达式(regular expression)是一个描述字符模式的对象,ECMAScript的RegExp 类表示正则表达式,而String和RegExp都定义了使用正则表达式进行强大的模式匹配和文本检索与替换的函数。可以用来检查一个串是否含有某种子串、将匹配的子串做替换或者从某个串中取出符合某个条件的子...

2018-05-13 22:11:22 522

原创 jQuery源码学习(1)- 整体架构

学习版本:jQuery2.0.3学习博客链接:艾伦Aaron和nuysoft源码github地址:https://github.com/junzizaixi/jQuery-.git1、整体架构jQuery框架的核心就是从HTML文档中匹配元素并对其执行操作。1.1自调用匿名函数打开jQuery源码,首先你会看到这样的代码结构:(function(window,undefined){ //j...

2018-05-13 22:10:51 197

原创 牛客网、赛码网javascript在线编程的输入输出

        之前做剑指offer的题,题目的函数都已定义,自己只需要写函数体,等到做公司真题,才发现函数这些都是不存在的,输入输出都需要自己定义,百度后,写这篇博客加深印象。        首先,输入输出均采用nodeJS,nodeJS控制台默认输入是字符串类型,若需要数字类型需要进行转化。        1、单行输入      var readline = require('readline...

2018-05-05 18:16:55 7328 3

原创 web优化之YSlow的使用

前几天看了几篇关于web优化的文章,优化方法大同小异,减少HTTP请求,压缩代码,图片汇总等。今天看到关于YSlow的介绍,才想到竟然有这么个插件,提示你哪里可以优化。YSlow是Yahoo发布的一款基于FireFox的插件,安装YSlow必须首先先安装 Firebug,然后下载YSlow,再对其安装。一、YSlow有什么用?YSlow可以对网站的页面进行分析,并告诉你为了提高网站性能,如何基于某...

2018-05-02 17:42:24 319

原创 JS中链表的处理

最近在做关于链表的算法题,觉得有必要对链表的一些知识点做个梳理。当然都是通过看了各种文章组合起来的,感谢别人的分享。1、链表与数组的差别         链表的特性是在中间任意位置添加删除元素的都非常的快,不需要移动其它的元素。通常链表每一个元素都要保存一个指向下一个元素的指针(单链表)。双链表的话每个元素即要保存到下一个元素的指针,还要保存一个上一个元素的指针。循环链表则把最后一个元...

2018-04-21 18:48:19 1839 2

原创 X3D制作简易三维动画

第一次接触X3D,想留下一些自己的学习想法。首先,直接百度X3D,会发现除了官网文档,其他的资料很少,官网文档全英文,看完它提供的例子后,知道X3D是一个HTML5框架,可以直接在项目文件中引入X3D框架,然后在HTML文档中直接写<x3d></x3d>的标签,而<x3d>标签里面的内容就是三维的,我们可以随意用鼠标变换三维坐标轴,从而看到物体的各个面。但官网内...

2018-03-25 21:11:51 8218

运用webgl实现的带有阴影的动画

不使用Three.js等框架,纯webgl的原生代码,帮助更好的理解webgl。该动画能改变物体颜色、速度、深度、光源位置、物体位置等。

2018-04-16

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除