blog station

天下事有难易乎?为之,则难者亦易矣;不为,则易者亦难矣。

html-webpack-plugin插件,webpack中生成HTML的插件

配置文件

1
2
3
4
5
6
7
8
module.exports = {
entry: __dirname + "/app/main.js", //已多次提及的唯一入口文件
output: {
path: __dirname + "/public", //打包后的文件存放的地方
filename: "bundle.js" //打包后输出文件的文件名
}
}
`注:“__dirname”是node.js中的一个全局变量,它指向当前执行脚本所在的目录。`

iOS中时间格式

ios不支持时间格式如:new Date(2018-01-24)或者 new Date(2018.01.24)格式转换,会抛出NaN,所以要转换成/格式的,如:

1
2
3
4
5
let date = 2018-02-12;
let newDate = date.replace(/-/g,'/');
let returnDate = new Date(newDate)
加时分秒:
例如:2018/10/10 12:34:59支持

iOS11.XX以上的iPhone注意

阅读全文 »

如何将本地文件上传到Github上?

1.在目录中创建新的 Git 仓库

进入到你本地项目的根目录下,执行 git init 命令,就可以创建一个 Git 仓库了

1
$ git init
阅读全文 »

如何让css只在当前组件起作用

这样写其他组件引用当前组件时当前组件中的css无法作用在其他组件(个人认为中小项目不需要加这个属性,因为组件之间的调用会很少很少)
同级组件不加scope如果有相同类名,会相互影响(同级当前组件优先级高)

1
<style scoped></style>

v-for遍历数据中的v-bind:key(:key)问题

阅读全文 »

let const

let和var类似,let必须先声明后使用,否则会报错,let不存在变量提升;
let声明变量,const声明常量;

1
2
3
4
5
6
7
8
function block(){
let n = 5;
if(true){
let n = 10;
}
console.log(n) //5
}
block()

上面代码说明let有块级作用域,不同块级相同变量不受影响;

阅读全文 »

trigger() 方法

给指定元素添加触发事件,例:$(“#this”).trigger(“click”)

###jQuery noConflict() 方法
noConflict() 方法会释放会 $ 标识符的控制,这样其他脚本就可以使用它了。

1
2
3
4
5
6
var jq = $.noConflict();
jq(document).ready(function(){
jq("button").click(function(){
jq("p").text("jQuery 仍在运行!");
});
});
阅读全文 »

css

  1. CSS BFC

js

  1. promise

  2. 跨域

  3. Macrotask Queue和Microtask Queue

  4. 数组排序

  5. 数组去重

  6. ES6

  7. WebAssembly 是一种可以使用非 JavaScript 编程语言编写代码并且能在浏览器上运行的技术方案。、

  8. ES5,ES6中this指向

  9. 理解 JavaScript 中的 This, Bind, Call 和 Apply
    详情

  10. 如何判断object是数组类型?
    1、从原型入手,Array.prototype.isPrototypeOf(obj);
    2.Array.isArray()方法。例:Array.isArray([1, 2, 3]); // true

  11. 精确获取页面元素位置的方式有哪些

    1
    2
    3
    4
    5
    var X= this.getBoundingClientRect().left;
    var Y =this.getBoundingClientRect().top;
    //再加上滚动距离,就可以得到绝对位置
    var X= this.getBoundingClientRect().left+document.documentElement.scrollLeft;
    var Y =this.getBoundingClientRect().top+document.documentElement.scrollTop;
  12. 事件委托
    又叫事件代理,利用事件冒泡,只指定一个事件处理程序,就可以管理某一类型的所有事件;
    作用:
    在JavaScript中,添加到页面上的事件处理程序数量将直接关系到页面的整体运行性能,因为需要不断的与dom节点进行交互,访问dom的次数越多,引起浏览器重绘与重排的次数也就越多,就会延长整个页面的交互就绪时间,这就是为什么性能优化的主要思想之一就是减少DOM操作的原因;如果要用事件委托,就会将所有的操作放到js程序里面,与dom的操作就只需要交互一次,这样就能大大的减少与dom的交互次数,提高性能;

阅读全文 »

.split()方法

stringObject.split(separator,howm)
separator: 必需,字符串或正则表达式,以这个字符对应要操作的字符串中的字符分割
howm: 可选,返回数组的最大长度
注 以多个字符分割字符串 正则搞定:
stringObject.split(/[-,./]/)

.splice()方法

array.splice(index,howmany,item1,…..,itemX);
参数1必需。整数,规定添加/删除项目的位置,使用负数可从数组结尾处规定位置。,
参数2必需。要删除的项目数量。如果设置为 0,则不会删除项目。,
参数3可选。向数组添加的新项目。

阅读全文 »

一、变量是个好东西
在任何语言中,变量的有一点作用都是一样的,那就是可以降低维护成本,附带还有更高性能,文件更高压缩率的好处。

随着CSS预编译工具Sass/Less/Stylus的关注和逐渐流行,CSS工作组迅速跟进CSS变量的规范制定,并且,很多浏览器已经跟进,目前,在部分项目中已经可以直接使用了。

Chrome/Firefox/Safari浏览器都是绿油油的,兼容性大大超出我的预期,于是果断尝鲜记录下语法用法和特性。

二、CSS变量var()语法和用法和特性
CSS中原生的变量定义语法是:–*,变量使用语法是:var(--*),其中*表示我们的变量名称。关于命名这个东西,各种语言都有些显示,例如CSS选择器不能是数字开头,JS中的变量是不能直接数值的,但是,在CSS变量中,这些限制通通没有,例如:

阅读全文 »
0%