hc2018的博客

原创 rem.js

【代码】rem.js。

原创 记录kindEditor上传图片功能遇到的问题

参考方法1.查找kindeditor-all.js的KindEditor.plugin(‘image’, function(K) {这行代码2.查找下面提交图片办法,因为会出现跨域问题//uploadbutton.submit();3.将此代码添加在后面var formData = new FormData();var file=uploadbutton.fileBox[0].files[0];formData.append(file.name, file);//console.log(

转载 ES6 - Babel编译环境搭建

命令行cd到项目文件夹之后，执行以下命令：（mac记得前边加sudo）npm init –y // 创建package.jsonnpm install @babel/core @babel/cli @babel/preset-env //安装所需babel@babel/core：是整个功能中最核心的模块。core就是核心的意思。里边的一个核心功能就是transform，把js代码编程抽...

原创 根据后端返回的文件流下载文件

直接贴代码data是文件流的数据, name是文件名download (data, name) { if (!data) { return } let blob = new Blob([data], { type: 'application/octet-str...

转载 hack技术

什么是hack 技术：行业中存在各种浏览器，典型的浏览器包括 IE 、火狐、谷歌等等；同样种类的浏览器，也存在着不同的版本，如 IE6、IE7…等。不同浏览器对 CSS 解析机制并不是完全相同，因此会导致不同浏览器中，页面的效果各不相同。此时可以针对某种浏览器进行样式设置，从而达到所有浏览器显示的效果一致，这种标识不同浏览器的方法就是 hack简单地说就是可以通过 hack 技术，只针对...

原创 vuex存储公共数据

1：首先先下载 vuexnpm i vuex -S2：然后引入vueximport Vuex from ‘vuex’3：注册到Vue实例上Vue.use(Vuex)4：创造一个Vuex实例var store = new Vuex.Store({ state:{ // 这里相当于Vue实例中的data，用于存放数据 msg: '我是公共的数据，来拿我呀QAQ' }, m...

原创 getBoundingClientRect() 属性获取当前屏幕距离 `上下左右` 的坐标值

可以获取指定dom元素当前离屏幕指定方位的距离<div id="div">我的坐标</div>document.getElementById('div').getBoundingClientRect().top // 获取当前元素距离屏幕顶部的坐标值document.getElementById('div').getBoundingClientRect().left ...

原创 es6中的Promise的使用

在es6中新增了一个Promise主要是解决了回调地狱的问题（函数里面一层一层的调用，像18层地狱，哈哈哈），导致结构不清晰Promise是一个构造函数 需要new出来 return 返回实例出去才能通过.then拿到参数，Promise 是执行的异步，所以比同步代码慢const fs = require('fs')function getPromise(fPath){ va...

原创 关于webpack的安装与使用----及一些踩过的坑

webpack是我们前端开发人员很好用的一个打包工具 因为它支持一键打包，以及一些命令也很人性化。目的是将所有的文件 集成与一个js文件 避免二次请求 对服务器减压直接走入正题吧。第一步首先 新建一个文件夹 文件夹一定不能为中文 否则会出现一些未知的错误，这个坑我已经踩过了~~ 直接给个语义化最强的名字吧 就叫webpack好了然后在里面建两个文件夹 一个src 用于放我们写好的页面 ...

原创 vue中的生命周期

在new Vue()实例对象的时候 表示初始化了一个新的生命周期1：在beforeCreate的时候 表示data，methods的数据都还没初始化好2：在created的时候 表示data，methods的数据已经初始化生成好了3：在beforeMount的时候，模板已经编译好了，但是数据还是旧的，未挂到页面上去4：在mounted的时候，表示数据已经渲染到了页面上去了5：在befo...

原创 vue中自定义全局按钮修饰符和自定义全局指令

最近比较懒 不想打字~我就直接上个图吧这是自定义全局按钮修饰符：其实那个f2只是绑定的时候需要的名字跟形参实际意义差不多 关键是后面的键盘码 比如我打个114（f3的键盘码）我绑定f2 实际上我要按f3才能触发这次事件这是全局自定义指令 比如下面这个自定义一个自动获取文本框焦点指令...

原创 node中遇到的一些问题

在进行初始化的时候 一点不能加 install 不然会造成生成不了package.json 这个文件记录不了装的包 从而导致引入外部文件不起任何作用加了install 之后 只会生成一个package-lock.json的文件夹正常的初始化命令 npm init -y 直接完成 会自动生成两个文件在根目录 代表初始化成功了 如下图总之 命令这种东西 不能自己随便乱搞一些“创作”；在n...

原创 js中优雅降级与渐进增强

找了一上午 ，终于找到了，什么优雅降级，什么 渐进增强，就一个意思么，为了实现css3的特效和js之间的配合实现设计效果。不过话是这么说的 但是这个东西思路还是有些不一样优雅降级：在网站设计时，术语优雅降级指的是新的或者是复杂特点的明智实施，目的是确保大部分的因特网使用者可以有效的和站点上的页面交互。过去几年站点设计和因特网使用的重要的里程碑包括图片，帧，在线游戏，Java, JavaScri...

原创 node中通过express.static 托管静态资源网站

首先的 还是先下载express这个框架如果没有初始化 则先在终端（终端直接下载到当前目录文件夹）或者cmd初始化 npm init -y 快速初始化然后通过 npm install(可以缩写成 i ) express --save (可以缩写成-S);ok 完成了这两步 我们直接在js文件里面1: 引入express模块const express = require(‘expres...

原创 node.js 创建最基本的http服务器

1:首先引入http模块const http = require(‘http’);2:然后创建服务器const server = http.createServer();3:然后为server通过on方法 绑定一个request事件 当服 务器接收到这个请求的时候 触发这个事件回调函数里面有两个参数 一个request 一个response通过response的end()方法结束这...

原创 npm 安装本地包步骤

原创 npm安装和卸载全局包

其中install可以缩小为 i 例如：npm i i5ting_toc -g

原创 node.js自定义 包 的步骤

首先要自定义一个文件夹 文件夹里面要放的目录如下图lib目录里面放自己封装的方法然后在index.js(不一定要叫index.js，相当于一个集结很多方法的文件夹) 里面引入全局暴露的方法在package.json里面main属性里面把index.js路径放进去然后在需要用到这个包的地方引入包的路径就好（整个文件夹），直接用方法，下图是用了自定义包中的一个取余的方法...

原创 node.js中的exports和module.exports

默认情况下 exports 和 module.exports是全等的 都是一个空对象但是在暴露成员给外部的时候 永远以module.exports的指向为准返回的结果

原创 es6对象的简写方式

直接上图吧 我都写了注释接下来我们打印一下这个person这个是输出的结果 两个都一样 第二个更加的简便另外说一下这种简便方式的应用 比如我们在用jQuery使用ajax传递参数的时候 可以直接传参数进去 不需要传值 好吧~~我还是直接上图 简单明了...

原创 es6中的箭头函数

写法:普通函数的写法：function(x){ console.log(x)}箭头函数的写法：(x) => {console.log(x)} //箭头函数直接把function省略掉了 然后在形参的小括号右边有=> 代替 函数体不变箭头函数this的指向：箭头函数里的this永远指向外面函数的this举个简单的例子吧！这是普通的函数这是箭头函数直接明了 如果有不明白可...

原创 new URLSearchParams() 内置对象获取地址栏的参数 通过键的方式拿到值

首先声明一下 随便赋个值也行let a = new URLSearchParams(location.search);然后通过a.get()的方式输入键 拿到值就简单点吧 拿到前一个页面传过来的idlet id = a.get(‘id’);这样就可以直接拿到id了下面这个图是之前拿地址栏id的值的方式 通过window.location.search这样拿到的值是整个地址栏 ...

转载 html 浏览器的一些兼容性问题

1、html部分 a、最突出也是最容易想到的就是高版本的浏览器用了低版本的浏览器无法识别的元素，从而导致不能解析。这点主要体现在html5的新标签上 解决办法是：htmlshim框架可以让低于IE9的浏览器支持html5 b、img的alt属性，在图片不存在的情况下，各浏览器的解析不一致 在chrome下显示的是一张破损的图片，在ff下显示的是alt的文字...

原创 javascript es6新语法

es6 一些新的语法与用法1： let新的方式定义变量 相比于之前的var声明变量 有两个好处1.1 ： 之前用var 定义变量 只有函数才会起到作用域的左右 在{ } 对象这样的作用域里面不起左右 而用let则会在{ } 里面也会开启一个作用域1.2 ： 没有变量的提升2: const 定义常量 （常量一旦声明 不可重新赋值）2.1 : 也没有变量的提升2.2 ：在定义常量的时候 ...