- 博客(27)
- 收藏
- 关注
原创 echart - 柱形图
初始化柱状图function initBar(category, data){ // srcipt标签式引入 //基于准备好的dom,初始化echarts实例 var myChart = echarts.init(document.getElementById('bar')); var titleText = isStatis...
2018-03-11 10:55:28 912
原创 node.js - Module
前言 在学习node.js之前,先得了解一个东西:CommonJS。CommomJS规范的目标是为了构建js在包括Web服务器,桌面,命令行工具,及浏览器方面的生态系统。 可以说CommonJS是为了解决js没有模块系统、没有标准接口等问题的一些规范。而node.js就是这些规范的一种实现。本文主要记录下个人对node.js中 module的一些认知和尝试。Module 概念 模块
2017-12-18 23:47:08 314
原创 js - for,(for...in...),forEach(...),(for...of..)差异与原理浅析
通过案例以及各种循环的特征,来对它们的差异和原理进行浅析
2017-12-16 23:45:19 1586
原创 js-浅析js指向-this绑定优先级及特殊情况说明
通过之前的分析,我们可以知道常规this有哪些绑定规则,那他们如果同时出现在一个位置进行调用,优先级是怎么样的?通过实践总结,可以得出以下几条通用规则: 1. 函数是否在new中调用(new绑定)?如果是的话,this绑定的是新创建的对象; 2. 函数是否通过call,apply(显示绑定)或者硬绑定调用?如果是的话,this绑定的是指定的对象; 3. 函数是否再某个上下文对象中引用(隐式绑定
2017-12-13 22:54:10 562
原创 js-浅析this指向
在理解this的绑定过程之前,首先要理解调用位置:调用位置就是函数在代码中被调用的位置(而不是声明的位置)。对于正常的函数调用,this的绑定分为以下几种:
2017-12-11 23:25:26 205
原创 CSS3-transform-transform影响子级的固定定位
在进行限制范围拖拽代码编写时,父级为固定定位,子级为固定定位,给父级加transform,html和css代码分别如下:
2017-11-15 08:17:41 3906
原创 js-dom-使用错误记录
hasChildNodes() 如果包含子节点,就返回ture。在判断是否有子节点时,比直接查询childNodes.length来的简单insertBefore() 作用是在指定元素之前,插入新的元素。所接收的参数有两个:newNode-要插入的节点。node-在哪个节点前插入。注意事项:==如果第二个参数为null,则insertBefore和appendChild效果一样。如果是
2017-11-11 00:19:18 640
原创 booterStrap体验-首页改造-轮播图
在没有接触booterStrap之前,写轮播图。方法有两种:一种是用css3动画进行编写,另一种是用js进行图片的位置改变。而在booterStrap中有一个carousel插件,可以方便快捷的进行轮播图编写。
2017-11-06 22:03:50 404
原创 booterStrap体验-首页改造-响应式导航栏(2)
如果按照上一篇提到的方法,得到的结果如下所示: 之所以出现这种情况是因为在html中将汉堡菜单和logo写在了同一个div里,并且这两个在booterstrap样式里是分别左右浮动。 为了达到原图所要的效果,得用到booterstrap中另一个重要的概念:栅格系统。
2017-10-28 19:21:17 710
原创 js-数组排序及去重
冒泡排序: 每次从数组中拿出两位来进行排序,大的放在后边,小的放在前边。当然也可以小的在后面,大的在前面。以下以从小到大排序作为例子。
2017-10-24 21:52:29 367
原创 booterStrap体验-首页改造-响应式导航栏(1)
闲暇之余想要学习下booterstrap,正好在一个设计网站看到了一些有响应式布局的设计图。已经将纯css写过一遍首页,现在着手使用booterstrap进行改造。首先了解下修改booterstrap导航需要用到哪些类,样式后期再改。需要达到的效果如下所示:
2017-10-23 22:23:08 662
原创 js-subString与slice差异
从subString与slice的语法定义来看,两者的用途相似。但是深入学习后,发现他们之间存在许多不同
2017-10-20 23:16:04 792
原创 CSS3动画-扇形展开-(内有js代码)
本文记录的是使用css新属性制作的扇形展开效果。其功能有:1.当页面加载完成之后,所有的卡片会像扇子一样展开;2.当点击封面,也就是最右边的卡片时,扇子会进行展示或折叠;3.除封面外的任意一张卡片,该卡片会旋转到中间(整个扇子都旋转),并且卡片上的文字会展示出来。
2017-10-15 00:10:27 3558 1
原创 《图解http》之返回结果的http状态码
2XX 2XX的响应结果表明请求被正常处理了;200 OK 表示从客户端发来的请求在服务器端被正常处理了。在响应报文中,随状态码一起返回的信息会因方法的不同而发生变化。204 Not Content 该状态码代表服务器接收的请求已成功处理,但在返回的响应报文中不含实体的主体部分。另外也不允许返回任何实体的主体。
2017-10-09 23:31:10 515
原创 js-10*10个div-制作整图碎片化效果
在学会使用js将一个div变成10*10个div组成后,具体参照js-使用js生成10*10个带标号的div。研究了下如何做出整图碎片化的效果。其实实现原理很简单,使用Math.random()使每个图片位移值和斜切值为任意值,同时设置图片的透明度,就可以制作出整图碎片化并消失不见的效果。
2017-10-08 22:22:47 2093
原创 CSS3动画-定位元素层级覆盖问题
在之前写过一篇博客js-使用js生成10*10个带标号的div,关于如何使用js生成10*10的100个div。最近尝试着在这使用定位+循环生成的100个div上加上span并配合css3里的transform,相当于每一个div都是一个四个面的立方体,每一个面都是一整张背景图的一部分。但是出现了定位元素层级覆盖问题
2017-10-01 22:57:31 6014
原创 js-从作用域链谈闭包
现在很多人在面试前端开发时,都会被问到闭包。那闭包是什么呢?当我们遇到此类问题时,应该如何回答呢?就我而言,我觉得如果要回答闭包问题,就得先从作用域链开始讲起。
2017-09-30 18:57:53 359
原创 js-每个alert弹出的内容是什么?-js预编译规则
在讲述预编译概念之前,先拿出一道习题,看看能不能准确地知道每一个alert会弹出什么内容。
2017-09-29 22:46:50 471
原创 js-使用js生成10*10个带标号的div
在网上看到很多都是使用两个循环嵌套起来生成10*10个div,今天想到了一些新的方法,就记录了下来。其实这个实现并不复杂,只是需要费点心思找下规律。本文使用了三种方法:循环嵌套+定位,浮动+单循环,定位+单循环
2017-09-29 00:21:05 1918
原创 display:inline-block与float在布局时的差异分析
在布局的时候,很多设计都需要将元素排列在一行,使元素排列在一行的方法有多种,从兼容性和易用性来考虑,先介绍display:inline-block(显示为内联块)和float(浮动)。
2017-09-17 23:46:49 884
原创 使不知宽高的元素水平垂直居中的方法
本文主要介绍如何使元素居中显示的几种方法,当然方法有很多,现在记录的不过是笔者目前能够想到的几种:定位、table-cell、增加空span、弹性盒模型。
2017-09-15 16:49:58 1641
原创 兼容浏览器的最小高度(min-height)
前言:在网页设计中,常常遇到需要设置最小高度的问题。例如,设计方案中需要给一个div设置一个背景图,而该div并不限定具体宽高值,其内部内容无法撑开背景图完全显示所需要的高度,此时便需要设置最小高度。即当div内的内容无法撑开父级高度时,会有一个最小高度保证父级背景显示完全,而当内容高度大于最小高度时,该div的高度就会完全由内容撑开。这里边要用到css的一个属性,即min-height。
2017-09-14 12:58:25 2214
原创 响应式布局-图片列表如何在窄屏(<320px)中显示为列,在宽屏(>768px)中显示为有间隙的一行
摘要:本文旨在介绍在宽屏(>768px)中图片列表中如何显示为有固定间隙的一行排列,介绍了笔者自己尝试过得五种写法,并分析了其缺点,采用什么方法就得见人见智,具体情况具体分析了。 如何在窄屏(
2017-09-04 20:11:12 1639 1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人