juzipchy-CSDN博客

原创 CSS3中不熟悉的属性1：box-pack和box-align

box-pack 定义和用法： box-pack 属性规定当框大于子元素的尺寸，在何处放置子元素。该属性规定水平框中的水平位置，以及垂直框中的垂直位置。语法： box-pack: start|end|center|justify; start: 对于正常方向的框，首个子元素的左边缘被放在左侧（最后的子元素后是所有剩余的空间）对于相反方向的框，最后子元素的右边缘被放在右侧（首个子元

2017-06-05 18:44:53 602

原创 CSS3中vh

vh 说明：相对于视口的高度。视口被均分为100单位的vh. 示例代码：h1 { font-size: 8vh;}如果视口的高度是200mm，那么上述代码中h1元素的字号将为16mm，即(8x200)/100实例：<!DOCTYPE html><html lang="zh-cmn-Hans"><head><meta charset="utf-8" /><title></ti

2017-05-15 19:46:57 677

原创 SourceTree图谱颜色区别

从左侧数第一条竖线，是本地自己创建的feature分支，该分支是从本地dev分支创建的。第二条线，紫色的线，可以看到该线，在备注处有个标识，origin/dev，表明该线是远端的dev分支。第三条线，棕黄色的线，代表了其他人的创建的分支。

2017-05-15 10:29:57 7712 1

原创 css3字体缩放样式-webkit-text-size-adjust的用法详解

又是看源码看到的写页面的应该都知道Chrome浏览器默认情况下的字体最小为12px，如果你要设置某字体大小为10px的话，你会在Chrome发现还是12px。如果要使此生效的话，就得修改Chrome的默认配置了，一般应用下面的代码就能在全局生效了：html { -webkit-text-size-adjust: none; }但是这样设置之后会有一个问题，就是当你放大网页时，一般情况下字体也会随着变

2017-05-07 20:12:47 19087 3

原创 CSS3 修改和去除移动端点击事件出现的背景框 (tap-highlight-color)

看了微博的移动端的一个源码，对某一行代码有点懵逼：a { -webkit-tap-highlight-color: rgba(255, 255, 255, 0);}度娘查了一下，现记录如下：这个属性是用于设定元素在移动设备（如Adnroid、iOS）上被触发点击事件时，响应的背景框的颜色。例如在Adnroid版本的微信中，点击a标签时将会出现一个橙色的小框表示点击的响应。此时，如果对元素设

2017-05-07 20:01:15 367

原创 Sass学习总结

以下代码是基于scss格式的：.sass与.scss的区别 “.sass”只能使用 Sass 老语法规则（缩进规则），“.scss”使用的是 Sass 的新语法规则，也就是 SCSS 语法规则（类似 CSS 语法格式）。 .sass:$font-stack: Helvetica, sans-serif //定义变量$primary-color: #333 //定义变量body font:

2017-04-23 15:18:59 787

原创 Sass在win7环境中的安装

好讨厌安装各种东西，一装准失败，心累，安装这个sass也装了一天没装好，网上教程也不太对，各种毛病。现在win7环境下只要按照下面的步骤安装就好了： 1.sass是用ruby写的，安装sass之前，要安装ruby，到ruby官网下载合适版本即可单击这里下载我下载的版本是红框圈出来的 2.下载完成后一路next下去安装，要注意的是到图中这一步的时候，要选中第二个选项，，添加环境变量，不然以

2017-04-23 10:07:49 996

原创 Set数据结构实现数组的交集、并集、差集

Set数据结构是es6中新增的，它类似于数组，但是成员的值唯一，没有重复值。 Set本身是一个数据结构，用来生成Set数据节后Set数据结构的实例有4种遍历方法： keys()：返回一个键名的遍历器 values()：返回一个键值便利器 entries():返回一个键值对便利器 forEach():使用回调函数遍历每个成员由于Set数据结构没有键名，只有键值（或者说键名和键值是同一个值），

2017-04-20 22:06:07 1579

原创 javascript数组遍历for in的一些坑

js中数组遍历的时候，常见的的是for循环，简单易懂for (var index = 0; index < myArray.length; index++) { console.log(myArray[index]);}但这样写比较麻烦也许你想到了用数组的forEach方法遍历myArray.forEach(function (value) { console.log(value);});短

2017-04-20 20:38:03 10678

原创 js中var的重复声明

腾讯的一个笔试题，先看一下var a = 100;function fn() { alert(a); //undefined var a = 200; alert(a); //200}fn();alert(a); //100var a;alert(a); //100var a = 300;alert(a); //300前两个很简单，不解释

2017-04-12 09:11:16 7101 2

原创前端安全问题：CSRF

什么是csrf: 　CSRF（Cross-site request forgery），中文名称：跨站请求伪造，也被称为：one click attack/session riding，缩写为：CSRF/XSRF。可以这么理解CSRF攻击：攻击者盗用了你的身份，以你的名义发送恶意请求。CSRF能够做的事情包括：以你名义发送邮件，发消息，盗取你的账号，甚至于购买商品，虚拟货币转账……造成的问

2017-04-06 14:21:36 828

原创 Vue:计算属性computed

在模板中绑定表达式是非常便利的，但是它们实际上只用于简单的操作。模板是为了描述视图的结构。在模板中放入太多的逻辑会让模板过重且难以维护。这就是为什么 Vue.js 将绑定表达式限制为一个表达式。如果需要多于一个表达式的逻辑，应当使用计算属性。实例： js: new Vue({ el:'#box', data:{ a:1 },

2017-03-31 15:03:02 728

原创 Vue:pros绑定

组件实例的作用域是孤立的。这意味着不能并且不应该在子组件的模板内直接引用父组件的数据。可以使用 props 把数据传给子组件。“prop” 是组件数据的一个字段，期望从父组件传下来。子组件需要显式地用 props 选项声明 props：Vue.component('child', { // 声明 props props: ['msg'], // prop 可以用在模板内 // 可以

2017-03-30 14:06:34 2338

原创 Vue父子、父子孙组件嵌套

单个组件的语法：创建构造器var MyComponent = Vue.extend({ template: '<div>A custom component!</div>' }); 注册组件Vue.component('my-component', MyComponent);父子组件的写法： var child = Vue.extend({ tem

2017-03-30 10:16:18 6113

原创 npm --save-dev --save 的区别

npm install 在安装 npm 包时，有两种命令参数可以把它们的信息写入 package.json 文件，一个是npm install--save另一个是 npm install –save-dev，他们表面上的区别是--save 会把依赖包名称添加到 package.json 文件 dependencies 键下，--save-dev 则添加到 package.json 文件 devDep

2017-03-24 21:15:28 50032 3

原创 javascript中的一些坑

1.对象使用和属性 JavaScript 中所有变量都可以当作对象使用，除了两个例外 null 和 undefined。一个常见的误解是数字的字面值（literal）不能当作对象使用。这是因为 JavaScript 解析器的一个错误，它试图将点操作符解析为浮点数字面值的一部分。2.toString(); // 出错：SyntaxError有很多变通方法可以让数字的字面值看起来像对象。2..t

2017-03-20 18:35:18 408

原创 javascript设计模式：简单工厂模式

//篮球基类 var Basketball= function () { this.intro="篮球盛行于美国"; } Basketball.prototype={ getMember:function(){ console.log("每个队伍需要5名队员"); }, getBallSi

2017-03-13 21:21:03 261

原创 HTTP缓存

浏览器端缓存分类缓存主要分为强缓存和协商缓存。强缓存：浏览器在加载资源时，先根据这个资源的一些http header判断它是否命中强缓存，强缓存如果命中，浏览器直接从自己的缓存中读取资源，不会发请求到服务器。协商缓存：当强缓存没有命中的时候，浏览器一定会发送一个请求到服务器，通过服务器端依据资源的另外一些http header验证这个资源是否命中协商缓存，如果协商缓存命中，服务器会将这个

2017-03-08 15:48:40 593

原创 HTTP状态码302、303、307区别

HTTP状态码3XX表示重定向，表明浏览器需要执行某些特殊的处理以正确处理请求。301 Moved Permanently 永久性定向。该状态码表示请求的资源已被分配了新的URI，以后应使用资源现在所指的URI。302 Found 临时性重定向。该状态码表示请求的资源已被分配了新的URI，希望用户（本次）能使用新的URI访问。和301相似，但302表示的资源不是永久移动，只是临时性

2017-03-05 21:50:20 42869 2

原创通用的事件侦听器函数

总结了下事件监听函数，能兼容ie和非ie浏览器// event(事件)工具集，来源：github.com/markyunmarkyun.Event = { // 页面加载完成后 readyEvent : function(fn) { if (fn==null) { fn=document; } var oldo

2017-03-03 13:33:17 478

原创数组去重

又是一个常见的面试题= =… 话说我最近怎么老是就面试题写博客总结下数组去重的四种常见的做法，以及相应的运行时间的比较：方法1：创建一个新的临时数组来保存数组中已有的元素Array.prototype.unique1 = function(){ var n = []; //一个新的临时数组 for(var i=0; i<this.length; i++){

2017-03-02 19:32:22 314

原创用CSS实现一个简单的幻灯片效果页面

又是一个常见面试题，不搜不知道，一搜吓一跳，有很多很有意思的写法。第一反应是利用CSS3的animation。不过为了兼容浏览器，记得加各浏览器前缀（“chrome和safira：-webkit-”、“firefox:-moz-”、“opera:-o-”）下面说说用到的animation各属性。 animation-name(动画名字，需用引号包裹) animation-duration(动

2017-03-02 17:30:02 7376

原创 javascript中的prototype属性

在js中经常看到prototype，看了一遍，理解了后又忘了，- - …可能是理解的不够深入，现在写个博客总结下：每个函数都有一个prototype属性，这个属性是指向一个对象的引用，这个对象称为原型对象，原型对象包含函数实例共享的方法和属性，也就是说将函数被用作构造函数调用（使用new操作符调用）的时候，新创建的对象会从原型对象上继承属性和方法。你不需要显式地声明一个prototype属性，因为在

2017-02-23 11:21:10 370 2

原创跨域：JSONP

这几天在看面试题，发现跨域这个知识点被问到很多次，网上搜了搜各种资料，五花八门，- - …整了半天，算是明白了什么意思。总结如下：首先要明白的是：<script>标签是不受同源策略的限制的，它可以载入任意地方的 JavaScript 文件，而并不要求同源。同样的有src属性的标签都不受同源策略的限制，比如<img><iframe>.跨域的核心就是利用这个。JSONP 的理念就是，我和服务端约定好一个

2017-02-22 17:10:54 390

原创 if(3 == true)

昨天看了微店的一道面试题if(3 ==true)中if的返回结果应该是什么。我个人觉得应该为true。写代码运行了下，结果为false。又写代码测试了下结果。 alert(1=="1"); //true alert(1==true); //true alert(0==false); //true alert(-1==false); // false

2017-02-18 10:35:35 1690

原创 json对象和json字符串之间的转化

1.使用jQuery插件$.parseJSON( jsonstr ); //jQuery.parseJSON(jsonstr),可以将json字符串转换成json对象2.使用工具函数JSON.parse(jsonstr); //可以将json字符串转换成json对象JSON.stringify(jsonobj); //可以将json对象转换成json对符串 3.使用Javascript支持的转换

2017-02-17 21:19:18 342

原创构造函数是否有new的区别

在JavaScript中，任何合法的函数都可以作为对象的构造函数，这既包括系统内置函数，也包括用户自己定义的函数。一旦函数被作为构造函数执行，它内部的this属性将引用函数本身。通常来说，构造函数没有返回值，它们只是初始化由this指针传递进来的对象，并且什么也不返回。如果一个函数有返回值，被返回的对象就成了new表达式的值。从形式上看，一个函数被作为构造函数还是普通函数执行的唯一区别，是否用new

2017-02-17 13:27:29 1848

原创 javascript中void()的用法

举个例子，void(0）这个写法看着很陌生，弄不明白是干什么的。实际上我们在写页面的时候在很多地方都使用到它了，只不过是没注意到罢了。在这里进行一下介绍void是一元运算符，它出现在操作数之前，操作数可以是任意类型，操作数会照常计算，但忽略计算结果并返回undefined。由于void会忽略操作数的值，因此在操作数具有副作用的时候使用void来让程序更具语义console.log(void 0)

2017-02-16 22:04:48 2505

原创基本数据类型的详细介绍

[0]5种数据类型： [0.1]基本数据类型：Undefined、Null、Boolean、Number、String [0.1.1]基本类型值是指简单的数据段，5种基本类型是按值访问的，因为可以操作保存在变量中的实际值 [0.1.2]基本类型的值在内存中占据固定大小的空间，被保存在栈内存中。从一个变量向另一个变量复制基本类型的值，会创建这个值的一个副本

2017-02-16 21:41:55 1617

原创 JavaScript中toStirng()与Object.prototype.toString.call()区别

一、toString()能将某一个值转化为字符串的方法。然而它是如何将一个值从一种类型转化为字符串类型的呢？1.将boolean类型的值转化为string类型：console.log(true.toString());//"true"console.log(false.toString());//"false"2.将string类型按其字面量形式输出：var str = "test123y";c

2017-02-16 21:22:18 815

原创 javascript常见错误（1）

看下面的代码：(function() { var x=foo(); var foo=function foo() { return “foobar”; }; return x;})();在编辑器后运行后返回“TypeError”为什么不是 “foobar”？原因出在 var foo=function foo() {return “foobar”};第一个

2017-02-15 20:54:00 796

原创一个常见的闭包函数的分析

先看个代码： //糟糕的例子 //构造一个函数，用错误的方式给一个数组中的节点设置事件处理程序 //当点击一个节点时，按照预期，应该弹出一个对话框显示节点的序号 //但它总是会显示节点的数目 var add_the_handlers=function(nodes){ var i; for(var i=0;i<nodes.lengt

2017-02-15 19:45:42 701

原创 js中扩充类型的功能

javascript允许给语言的基本类型扩充功能，通过给Ojbject.prototype添加方法，可以让该方法对所有对象适用。这样的方式对数组、函数、字符串、数字、正则表达式和布尔值都适用。比如，我们可以给Function.prototype增加方法来使得该方法对所有函数可用： Function.prototype.method=function(name,fun){ this.p

2017-02-14 23:37:42 389

原创 js中的异常处理

js提供了一套异常处理机制，异常是干扰程序的正常流程的不寻常（但并非完全是出乎意料）的事故。当发现这样的事故时，你的程序应该抛出一个异常：var add=function(a,b){ if(typeof a!=="number"||typeof b!="number"){ throw { name:"typeerror",

2017-02-14 23:07:58 261

原创原型链的理解

function obj(name){ if(name){ this.name = name; } return this;}obj.prototype.name = "name2";var a = obj("name1");var b = new obj;console.log(a.name); // name1console.log(window

2017-02-14 21:16:06 371

原创函数中参数是否有var的区别

在牛客网上看了一个代码，很有意思，故记录下来，先来看一下代码<SCRIPT LANGUAGE="JavaScript">var bb = 1;function aa(bb) { bb = 2; alert(bb);};aa(bb);alert(bb);</SCRIPT>运行结果为2,1；不是我以为的2，2 看下面的代码，<script> var bb = 1;

2017-02-14 20:27:04 785

转载彻底理解JavaScript原型

原型是JavaScript中一个比较难理解的概念，原型相关的属性也比较多，对象有"[[prototype]]"属性，函数对象有"prototype"属性，原型对象有"constructor"属性。为了弄清原型，以及原型相关的这些属性关系，就有了这篇文章。相信通过这篇文章一定能够清楚的认识到原型，现在就开始原型之旅吧。认识原型开始原型的介绍之前，首先来认识一下什么是原型？在Jav

2017-02-14 19:40:45 281

原创闭包与变量

闭包：有权访问另一个函数作用域中的变量的函数闭包只能取得包含函数中任何变量的最后一个值。闭包保存的是整个变量对象，而不是某个特殊的变量，下面这个例子可以清楚的说明这个问题。function createFunctions(){ var result = new Array(); for(var i=0; i<10;i++){ result[i]=

2017-02-07 18:49:16 443

原创 Bootstrap总结

bootstrap模板为使IE6、7、8版本（IE9以下版本）浏览器兼容html5新增的标签，引入下面代码文件即可。<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>同理为使IE6、7、8版本浏览器兼容css3样式，引入下面代码：<script src="https://oss.maxcdn

2017-01-05 20:42:39 771

转载 jquery，bootstrap数据验证插件bootstrapValidator

bootstrap：能够增加兼容性的强大框架.因为项目需要数据验证，看bootstrapValidator 还不错，就上手一直，完美兼容，

2017-01-05 11:25:03 683

空空如也

空空如也