2019年03月_栗子好好吃

转载 vue --- >SPA模式的组件

SPA：单页应用(Single Page App),具体好处,百度搜索我们可以想象一个场景，有两个页面,每个页面的头部都有一张 Logo 图片.如果每次都写成原始 HTML 的话,代码就会重复. // 页面1的代码如下: <div class='logo'> <img src='url'> </div> ...

2019-03-26 21:20:13 1396

转载 vue --- > 提交表单到服务器

<template><div> <textarea v-model='content'> </textarea> <br/> <input type='button' @click='submit' value='留言' /></div></template><scrip...

2019-03-26 20:31:32 2144

转载 vue --- > 基本的表单元素

<template><div> input: <input type='text' v-model='input_value' />, 输入的值: {{input_value}} <hr /> text area: <textarea v-model="textarea_value"></textarea>...

2019-03-26 20:02:51 254

转载 vue --- > Vue中的路由跳转问题

import Vue from 'vue'import Router from 'vue-router' // 前2个导入时vue框架自带的import SayHi from '@/components/SayHi' // 这个导入是自己写的位于components下的sayHiVue.use(Router) // 用到了vue的Router模块export default ...

2019-03-26 18:44:47 211

转载 vue --- > 使用字符串'api'跨域请求资源

vue环境下,修改config/index.js文件module.exports = { data: { proxyTable: { '/api': { target: 'http://siwei.me', // 将'api'转发到siwei.me上 changeOrigin: t...

2019-03-26 17:12:50 205

转载 JavaScript --- > 自定义优先级队列

// 基于一个Array对象,再加上内建的sort()方法,就能够创建一个普通的优先级队列。当需要将// 新的值添加到这个自定义的优先级队列中时,首先添加到这个数组中,然后对它进行排序。只需为// sort()方法提供一个自定义的比较函数即可,这个比较函数用来确定这个值再数组中的合适位置,使// 其能根据指定的优先级进行处理// 比较函数function compare(oValue...

2019-03-23 10:19:16 275

转载 jQuery --- > 简单操作合集

// 获取所有<p>元素$("p");// 获取一个ID为myDiv的<div>元素$("div#myDiv");// 获取所有type属性等于"text"的<input>元素$("input[@type=text]");// 获取所有p元素并隐藏它们$("p").hide();// 获取ID为myDiv的<div>元素,然后...

2019-03-23 09:19:48 112

转载 JavaScript --- > 自定义创建XHR对象的方法

function createXHR () { if (typeof XMLHttpRequest != "undefined") { return new XMLHttpRequest(); } else if (window.ActiveObject) { var aVersions = [ " MSXML2.XMLHttp.6.0", "MSX...

2019-03-22 11:12:41 543

转载 node --- > http数据上传

// 通过报头的Transfer-Encoding或Content-Length即可判断请求中是否带有内容var hasBody = function(req) { return 'transfer-encoding' in req.headers || 'content-length' in req.headers;};// 在HTTP_Parser解析报头结束后,报文内容部分会...

2019-03-21 16:46:23 287

转载 Node --- > Basic认证

Basic认证: 当客户端与服务器端进行请求时,允许通过用户名和密码实现的一种身份认证方式.// 如果一个页面需要Basic认证,它会检查请求报文头中的Authorization字段的内容,该字段的值由认证方式和加密值构成:$ curl -v "http://user:pass@www.baidu.com/"> GET / HTTP/1.1> Authorization: Ba...

2019-03-21 14:32:01 165

转载 JavaScript --- > 解析Cookie

var parseCookie = function(cookie){ var cookies = {}; if(!cookie){ return cookies; } var list = cookie.split(';'); for (var i=0;i<list.length;i++){ var pair = li...

2019-03-20 20:33:15 744

转载 Node --- > 构建一个HTTP服务

代码如下:var http = require('http');http.createServer(function (req, res){ res.writeHead(200,{'Content-Type': 'text/plain'}); res.end('Hello World\n');}).listen(1337, '127.0.0.1');console.log('Ser...

2019-03-20 15:25:48 94

转载 Node --- > Promise中的多异步协作

当我们需要处理多个异步调用时,应该如何处理呢?//首先假设有2个读取文件的异步调用,promise1和promise2var promise1 = readFile ("foo.txt", "utf-8");var promise2 = readFile ("bar.txt", "uft-8");//然后,我们可以使用all()方法将两个单独的Promise重写抽象组合成一个新的Prom...

2019-03-19 15:54:16 102

EventProxy来自于Backbone的事件模块,Backbone的事件模块是Model、View模块的基础功能，在前端有广泛的使用。它在每个非all事件触发时都会触发一次all事件，相关代码如下:// Trigger an event, firing all bound callbacks. Callbacks are passed the// same arguments as 'tr...

2019-03-19 11:20:19 246

原创 npm --- > 包的发布与导入

安装好NODE后,下面演示如何编写一个包,并将其发布到NPM仓库中,最后通过NPM安装回本地.以下例子是在windows*64环境下运行的.1.编写模块exports.sayHello = function(){ return 'Hello World';}将上述代码保存在hello.js中2.初始化包描述文件:使用npm init指令,快速生成包描述文件按照提示一步一...

2019-03-18 09:18:05 982

原创 css --- > 浮动元素与块框/行内框重叠时的细节

块框,可以认为是块级元素(如div、h1)的内容区 + 内边距行内框可以认为是行内元素(如span)的内容区 + 内边距当块级框/行内框和一个浮动元素重叠时，行内框的边框、背景和内容都在幅度元素之上，块级框的边框和背景都在浮动元素的下面，但内容在浮动元素的上面。见下图可以很明显的看到,框级框(h2#jump-up)在与图片重合时,其背景和边框全部,全部在浮动元素(img.sideli...

2019-03-15 09:36:03 1085

原创 css --- > 行内框和内容区

css规定font-size的大小实际上是字体的高度可以将内容区理解为font-size的大小.行内高可以理解为 ( (line-height) - (font-size) ) /2 然后再font-size 的上下加上前面的值看下面的例子 &amp;lt;p style=&quot;font-size:12px;line-height:12px;&quot;&amp;gt; this is text, &amp;

2019-03-13 15:19:46 470

原创 css --- > 选择器

span[class * = "cloud"] 代表span中有class且class中含有cloud子字符串, 如<span class="cloudy">span[class ^ = "bar"] 代表span中有class属性,且class属性中含bar开头的字符串, 如<span class="bargain">span[class $= "y&

2019-03-11 14:33:31 135

转载 JavaScript --- > 渲染数据量大的数组

很多时候，需要在页面上展示从后台来的大量数据,如果一次性渲染，会影响用户的体验。(而且浏览器中的JS严格限制了资源)/**使用分组的思想来渲染大量的数组*@parmas array 要处理的数组*@params process 对数组中每一个item进行的操作*@parmas context 执行的上下文*/function chunk(array, process, context...

2019-03-09 13:06:40 1109

原创 Echarts --- > 各个省份的坐标

纯手打…效果如下1.新疆: [86.61 , 40.79]2.西藏:[89.13 , 30.66]3.黑龙江:[128.34 , 47.05]4.吉林:[126.32 , 43.38]5.辽宁:[123.42 , 41.29]6.内蒙古:[112.17 , 42.81]7.北京:[116.40 , 40.40 ]8.宁夏:[106.27 , 36.76]9.山西:[111.95...

2019-03-07 16:34:27 3855 5

转载 JavaScript --- > 表单focus,blur,change事件的实现

假设有一个文本框，我们只允许用户输入数值。为此，我们希望:1.利用focus事件修改文本框内容，2.利用blur事件回复文本框的内容,3.利用change事件在用户输入了非数值字符时再次修改背景颜色。var EventUtil = { addHandler: function(element, type, handler) { // 跨浏览器的添加事件方法 if (...

2019-03-02 16:31:39 1418

转载 JavaScript --- > 取得鼠标事件的坐标

说明:1.IE8及更早的版本不支持事件对象上的页面坐标（pageX,pageY）2.下面的EventUtil参考上一篇var div =document.getElementById("myDiv");EventUtil.addHandler(div, "click", function(event) { event = EventUtil.getEvent(event); ...

2019-03-02 11:09:39 187

转载 JavaScript --- > 跨浏览器的事件对象

var EventUtil={ addHandler: function(element, type, handler){ if (element.addEventListener){ element.addEventListener(type, handler, false); } else if (element.att...

2019-03-01 21:20:11 160

栗子好好吃的博客