2016 年 9月随笔档案 - Ruth92

简版导航栏实现

摘要："来自今日头条线上笔试题" 【html:】 <!DOCTYPE html topbarMenu 首页 Profile Messages 【scss:】 { padding:0; margin:0; } body { background: 90d1ef; } ul { background: whi 阅读全文

posted @ 2016-09-26 18:29 Ruth92 阅读(139) 评论(0) 推荐(0)

webpack脚手架搭建（简单版）

摘要：运行命令 1. 安装依赖： 2. 运行项目：大致流程 1. ：新建 3. 将需要的依赖模块加入（生产环境）和（开发环境，在本地打包所需的模块） 3. ：自动安装上述添加好的模块 4. 配置 5. 配置的：自定义命令如果不在里面配置，可以通过手动安装模块（☟），输入命令，执行后会自动添阅读全文

posted @ 2016-09-26 16:53 Ruth92 阅读(5018) 评论(2) 推荐(1)

《深入浅出Node.js》第4章异步编程

摘要："@by Ruth92" （转载请注明出处）第4章异步编程 Node 能够迅速成功并流行起来的原因： V8 和异步 I/O 在性能上带来的提升；前后端 JavaScript 编程风格一致一、函数式编程 1. 高阶函数定义：是指把函数作为参数，或是将函数作为返回值的函数。应用：事件处理，阅读全文

posted @ 2016-09-20 09:18 Ruth92 阅读(203) 评论(0) 推荐(0)

js 实现继承相关

摘要：☊ 【要求】：实现一个Animal类, 和一个继承它的Dog类 ☛ 【实现】： function Animal(name) { this.name = name; } Animal.prototype.cry = function() { console.log('I am ' + this.nam 阅读全文

posted @ 2016-09-20 09:07 Ruth92 阅读(129) 评论(0) 推荐(0)

设计模式：观察者模式

摘要：观察者模式： ☂ 参考： "谈谈 JavaScript 的观察者模式（自定义事件）" 这是一种创建松散耦合代码的技术。它定义对象间一种一对多的依赖关系，当一个对象的状态发生改变时，所有依赖于它的对象都将得到通知。由主体和观察者组成，主体负责发布事件，同时观察者通过订阅这些事件来观察该主体。主阅读全文

posted @ 2016-09-19 17:57 Ruth92 阅读(199) 评论(0) 推荐(0)

bind 方法实现

摘要：【要求】：实现 bind 方法【实现】： // 简单方法 Function.prototype.bind = Function.prototpe.bind || function(context) { var me = this; return function() { return me.app 阅读全文

posted @ 2016-09-17 22:16 Ruth92 阅读(148) 评论(0) 推荐(0)

用 CSS 实现字符串截断

摘要：【要求】：如何用css实现字符串截断，超出约定长度后用缩略符...代替？ ♪ 答：用 css 实现字符串截断 div { width: 300px; overflow: hidden; / 规定当内容溢出元素框时发生的事情 / white space: nowrap; / 阅读全文

posted @ 2016-09-17 22:12 Ruth92 阅读(1141) 评论(0) 推荐(0)

纯 CSS 创建一个三角形

摘要：【要求】：用纯CSS创建一个三角形的原理是什么？ ♪ 答：把上、左、右三条边隐藏掉（颜色设为 transparent）【实现】： demo { width: 0; height: 0; border width: 20px; border style: solid; border color: 阅读全文

posted @ 2016-09-17 22:10 Ruth92 阅读(728) 评论(0) 推荐(0)

CSS 实现：两栏布局（等宽布局）

摘要：☊【实现要求】：两栏等宽布局 √【实现】： ♪ 两栏等宽布局（三栏等宽同理） ① 布局 .col 1, .col 2 { width: 50%; // 各占一半，尺寸相同 float: left; // 都脱离文档流 } 要想中间留有空隙，可以给两栏分别加上左右边框，但： ② （不推荐）元素间有换阅读全文

posted @ 2016-09-17 21:42 Ruth92 阅读(1610) 评论(0) 推荐(0)

CSS 实现：图片+文字的布局（综合）

摘要：☊【实现要求】：图片+文字+居中 √【实现】： ① + 文字标题1111 普通布局 .demo2 1 { // 文字可用demo1中的方案一布局; line height: $px; text align: center; img { width: $px; // 设置图片宽和高 height: 阅读全文

posted @ 2016-09-17 21:32 Ruth92 阅读(17718) 评论(0) 推荐(1)

jQuery：如何验证某个元素是否为空

摘要：【要求】：使用jQuery 如何验证某个元素是否为空 ♪ 答： aa pp / 判断是否有内容 / // 方法1： var isDivEmpty = $(' div1').text() ? false : true; // 方法2： var isInputEmpty = $ 阅读全文

posted @ 2016-09-17 18:09 Ruth92 阅读(6993) 评论(0) 推荐(1)

发送短信倒计时效果实现

摘要：【要求】：点击 button 按钮后，时间逐秒减少，期间按钮不可点击，直到减少至0后，恢复原值和可点击状态。【实现】： 60 var $btn = $(' btn'), wait = 4; function myFun() { $btn.attr('disabled', true); var t 阅读全文

posted @ 2016-09-13 21:25 Ruth92 阅读(228) 评论(0) 推荐(0)

《JavaScript模式》第2章基本技巧

摘要："@by Ruth92" （转载请注明出处）第2章基本技巧一、编写可维护的代码阅读性好具有一致性预见性好看起来如同一个人编写有文档编写注释编写 API 文档：用于命名包含以上对象的全局引用的名称。：有些命名不当，实际上是指对象或者构造函数。：定义对象中的方法和方法名。：列阅读全文

posted @ 2016-09-09 17:45 Ruth92 阅读(145) 评论(0) 推荐(0)

《JavaScript模式》第1章简介

摘要："@by Ruth92" （转载请注明出处）第1章简介模式模式：是指一个通用问题的解决方案。设计模式编码模式反模式：常见的、引发问题比解决的问题更多的一种方法。 JavaScript 基本概念 JS 五基本种类型（不是对象）：数值类型（）字符串类型（）布尔类型（）空类型（阅读全文

posted @ 2016-09-09 17:36 Ruth92 阅读(153) 评论(0) 推荐(0)

点击元素，只有它的背景变色

摘要："来自有道笔试" 【要求】：点击 li 元素，当且只有它的背景变为红色。【实现】： <!DOCTYPE html Document .red { background: red; } 12345 12345 12345 12345 12345 var oList = document.getEle 阅读全文

posted @ 2016-09-03 12:09 Ruth92 阅读(167) 评论(0) 推荐(0)

笔试题之优化代码

摘要：请优化下段的代码 for(var i = 0; i js 原生实现事件委托】： var body = document.getElementById('body'); body.addEventListener('mouseover', function(e) { e = e || window.e 阅读全文

posted @ 2016-09-03 12:08 Ruth92 阅读(227) 评论(0) 推荐(0)

jQuery实现一个全选复选框联动效果

摘要：类似邮件列表里的复选框要求双向联动 ☛ 【实现】：全选 var $ckAll = $('input[name=checkAll]'), $cb = $('input[name=cb]'), $cbList = $('.cbList'); $ckAll.on('click', function() 阅读全文

posted @ 2016-09-03 12:00 Ruth92 阅读(1136) 评论(0) 推荐(0)

Ruth92

09 2016 档案