前端
关注
分享
扫一扫
神百事
这个作者很懒，什么都没留下…
展开
-
position定位
absolute fixed relativefixed:相对与页面的定位absolute是相对于relative的定位；如果父级没有定位的话，relative是相对父级的定位 如果父级没有定位的话，absolute是相对于Body的定位原创 2015-12-18 15:49:20 · 317 阅读 · 0 评论 -
js的链式调用
一个简单的链式调用 //需求num不等于1，2，3 function Fn(num){ this.num = num; }; Fn.prototype.checkOne = function(){ if(this.num != 1){ return this; }else{ ret原创 2016-12-05 21:52:43 · 390 阅读 · 0 评论 -
js的36个设计模式：创建型模式
1.简单工厂模式 function fn(id,txt){ var o = new Object(); o.txt = txt; if(id == "a"){ o.show = function(){ console.log("a:" + this.txt); }转载 2016-12-12 17:06:01 · 432 阅读 · 0 评论 -
元素在页面内上下居中的4种方法
1.行内元素使用line-height等于行高;2.有设定宽高的元素.box{ width:100px; height:100px; position:absolute; top:0; bottom:0; right:0; left:0; margin:auto; }3.不定宽高的元素：.box{ width:100px原创 2015-12-18 15:40:25 · 2174 阅读 · 0 评论 -
js实现lazyman(流程控制)
function _lazyMan(name) { this.name = name; this.task = []; this.default(); var _this = this; setTimeout(function() { _this.next(); }, 0)}_lazyMan.prototype.next = fun原创 2017-04-21 13:22:59 · 1216 阅读 · 0 评论 -
es2015
//1.let 只在作用域内有效let name = "a";function fn() { let name = "b"; console.log(name); //b}fn();console.log(name); //a//2.const 用来声明常量，一但声明就无法改变const a = "a";//a = "b";console.log(a);//3.class 类原创 2017-04-21 13:23:53 · 447 阅读 · 0 评论 -
js的36个设计模式：结构型模式
1.外观模式（1）在对页面dom绑定原生点击事件的时候，dom2级会覆盖dom0级的操作；IE9不兼容addEventListener，而不支持dom2级的浏览器，又只能用dom0级的onclick。外观模式可以把一些兼容方法或者复杂的方法简化。function addEvent(dom,type,fn){ //dom2 if(dom.addEventListener){转载 2016-12-13 16:56:20 · 2012 阅读 · 0 评论 -
原生js实现复制浏览器内容
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <div id="con">需要复制的文字</div> <br> <input type="button" name="" value="点击复制" onclic原创 2017-04-21 13:28:34 · 4917 阅读 · 2 评论 -
js的36个设计模式：行为型模式
1.模板方法模式不太好描述，就类似封装一个插件，传入不同参数和函数，实现添加dom的样式和方法。2.观察者模式跳过3.状态模式把多个判断封装到函数内。var a = "run";function action(a){ if(a == "run"){ //code }else if(a == "jump"){ //code }else if(a原创 2017-04-21 13:29:19 · 980 阅读 · 0 评论 -
js的36个设计模式：技巧型模式
1.链模式通过return this,让函数对象可以链式调用。function fn(){ this.a = function(){ console.log("a"); return this; }; this.b = function(){ cosnole.log("b"); return this;原创 2017-04-21 13:29:59 · 522 阅读 · 0 评论 -
Git和GitHub学习笔记
上传新项目到Github1.在github创建仓库 2.执行下面操作初始化当前目录为GIT仓库工作空间git init生成README文件git add README.md将代码提交到本地仓库中，备注“first commit”git commit -m "first commit"创建远程仓库origin 连接服务器https://github.com/baishiup/hexoblogc原创 2016-12-13 14:36:05 · 407 阅读 · 0 评论 -
js e2e测试-nightwatch入门
js的所有数字都存储为根为64位的（8比特），浮点数。Number 方法 描述 toString() 数字转字符串，使用指定基数(a.toSting(10)按10进制) toLcaleString() 数字转字符串，使用本地数字格式顺序 toFixed() 数字转字符串，保留指定小数位（a.toFixed(2) == 0.02）） toExponential()转载 2017-08-02 18:05:13 · 1477 阅读 · 0 评论 -
js的36个设计模式：前奏
先是一些js面向对象的基础，后面的模式都会涉及到这些知识点。构造函数，原型对象 var Fn = function(f){ //var定义私有方法、属性 var num = 1; //this定义公有方法 this.getF = function(){ //... } //原创 2016-12-12 16:37:19 · 297 阅读 · 0 评论 -
js原生代码实现数据双向绑定
封装成jquery的插件了，复制代码后在Jquery之后引入； 也可以去掉插件那行直接使用。<!--使用方法--><div data-bind-1="name"></div><input type="text" data-bind-1="name" /><script> $.DBind(1).set("name", "123");</script>(function() {转载 2016-11-21 12:18:14 · 1016 阅读 · 0 评论 -
单行,多行文本溢出
//单行文本溢出 .inaline{ overflow : hidden; //超出隐藏 white-space:nowrap; //设置文本不会自动换行 text-overflow:ellipsis; //超出溢出,显示省略号 }//多行文本溢出 intwoline{ overflow: hidden;原创 2015-12-18 15:48:35 · 256 阅读 · 0 评论 -
css3 弹性盒子
display:-webkit-flex 定义元素为弹性盒子;属性:direction(方向) flex-direction : row //默认值,子元素正向1 2 3 布局 flex-direction : row-reverse //子元素正向3 2 1 布局flex-direction:column; //纵向布局 1 2 3 flex-direction:co原创 2015-12-18 15:48:13 · 307 阅读 · 0 评论 -
css3媒体查询
媒体查询类型: screen:屏幕 print:打印机 handheld:手持设备 all:通用媒体查询参数: width:视口宽度 height:视口高度 device-width:设备宽度 orientation:设备角度landscape:横向portrait:纵向ps:@media only screen and (orientation: landscape){原创 2015-12-18 15:17:29 · 278 阅读 · 0 评论 -
document.write插入js标签会覆盖页面的问题
浏览器处理页面时首先打开输入流(open()), 开始渲染页面， 页面渲染结束后关闭流(close())。document.write()在页面加载完毕后（onload）执行， 会重新打开输入流(open())， 输入流被2次打开时， 就会清除之前的页面内容， 所以有的时候document.write()会覆盖页面内容， 有的时候会追加内容。所以页面只要在onlaod之前使用doucm原创 2015-12-18 15:07:11 · 3296 阅读 · 0 评论 -
获取当前文件的绝对路径
var js=document.scripts;js=js[js.length-1].src.substring(0,js[js.length-1].src.lastIndexOf("/")+1);alert(js);//js就是当前文件的绝对路径原创 2015-12-18 14:52:31 · 800 阅读 · 1 评论 -
js判断手机横竖屏
window.addEventListener("onorientationchange" in window ? "orientationchange" : "resize", hengshuping, false);function hengshuping() { if (window.orientation == 180 || window.orientation == 0) {原创 2015-12-18 14:46:44 · 977 阅读 · 0 评论 -
计时器 setInterval clearInterval setTimeout
setTimeout(function,time); 只会执行一次setInterval(function,time); 会一直执行，每time时间执行一次。var settime = setInterval(function,time); clearInterval(settime); 清楚计时器的操作。原创 2015-12-18 14:36:18 · 349 阅读 · 0 评论 -
js获取当前url主机名和端口号
获取主机名var hostname = location.hostname;获取端口号var port = location.port;获取主机名+端口号var host = location.host;访问：172.16.0.1:30/login.htmlhostname = 172.16.0.1;port = 30;host = 172.16.0.1/30原创 2015-12-24 11:10:21 · 31433 阅读 · 0 评论 -
hexo+github搭建个人博客
hexonodejs的博客框架。1.npm install -g hexo2.hexo init3.原创 2016-10-27 12:55:35 · 317 阅读 · 0 评论 -
less学习笔记：基础语法
基础语法//注释//这条注释不会被编译到css/*这条注释会被编译到css*///一 变量@backcolor:#000;@font:14px;.a{ background-color: @backcolor; font-size: @font - 1;}//调用（类似函数）.a{ height: 100px;}.b{ width: 100px;原创 2016-11-08 13:15:19 · 295 阅读 · 0 评论 -
jquery源码分析笔记
jquery最外层原理(function(global,factory){ factory(global);})(this,function(window,noGlobal){ //code ... var jquery = function(selector,context){ return new fn(selector,context); }原创 2016-11-13 17:14:14 · 256 阅读 · 0 评论 -
js 单元测试-jest
facebook家出的。1 安装 npm init -y npm install jest2 创建demo.jsfunction sum(v1, v2) { return v1 + v2;}function sad() { return 123;}module.exports = { sum, sad };3 创建__tests__文件夹4 在__tests__ 下创建demo.转载 2017-08-02 18:09:36 · 594 阅读 · 0 评论