Skip to content

Instantly share code, notes, and snippets.

@ourai
ourai / get-water-from-water-dispenser.ts
Last active December 2, 2019 08:57
Get water from water dispenser
type WaterVolume = number;
interface IPerson {
id: number; // 人员标识
competent: boolean; // 是否有能力换水
altruistic: boolean; // 是否乐于助人
}
// 所有员工
const staffs: IPerson[] = [];
@ourai
ourai / text-ellipsis.html
Created June 19, 2014 07:56
IE8 中会出现即使文本被省略也会占用空间的情况,目前所知道的解决方案就是对父级也设置 `max-width`。
<!DOCTYPE>
<html>
<head>
<meta charset="UTF-8">
<title>文本省略</title>
<style>
a,
span {
display: inline-block;
*display: inline;
<!DOCTYPE>
<html>
<head>
<meta charset="UTF-8">
<style>
div,
img,
button {
display: block;
margin: 0;
@ourai
ourai / interview-questions.md
Last active August 29, 2015 14:01
这里都是我被考过的笔试题,解答方式肯定不唯一,我的方式也不一定是最好的,就是给大家一个思路而已。

笔试题荟萃

这里汇聚的是我在参加面试时所遇到过的问题。

如果各位也想测测自己是否能答出来的话,那么请只看「问题」部分,其他部分不要看。

问题

#lc {
@ourai
ourai / skills_of_f2e.md
Last active February 6, 2020 12:35
一个前端开发者所需要具备的知识和能力

前端开发者知识(能力)体系

本条目根据朴灵所整理的“前端开发知识结构”进行重新分类并拓展,以帮助将要或已经从事 web 前端开发的同行们理清思路,查缺补漏。

作为一个成熟的职业人,不仅仅要是一名优秀的开发人员,更应该深刻理解企业的需要并充分发挥自己的作用帮助所在公司取得最大效益。

开发技术

  • 程序
  • 标准规范
@ourai
ourai / alibaba_campus_quiz3.md
Last active July 24, 2018 07:32
阿里巴巴集团 2014 校园招聘攻略

智勇大闯关第三季

8月20日,阿里校园招聘前端岗位的在线笔试将统一开始。在这之前,我们先玩一下热身赛吧! http://ued.taobao.com/quiz3/ 截至8月18日11:00之前成功通关并且表现优异的同学,将有机会收到我们的惊喜邮件!

以上是阿里巴巴集团校园招聘的某一条微博的内容。

虽然我早已不是学生,本着好奇心也要玩一玩此游戏!经过几个小时的奋斗,我看到了美女,但不知道那是不是 True Ending。也许很多人把游戏通关之后就不玩不去探索了,可我不一样!我玩游戏向来都是要尽量把所有隐藏要素都挖掘出来才算结束。

正是因为知道结果,才有可能去优化过程,一个工程师的职责难道不正是这个么?“如何自动化、智能地去过每一关”的想法让我的血液稍微沸腾了起来。又经过几个小时的编码及测试,自我感觉已经把“隐藏要素”挖得差不多了。现将各个关卡的过关要点及自动获取过关条件的 JavaScript 脚本放出来。

@ourai
ourai / js_comment_spec.md
Last active August 18, 2021 08:57
JavaScript 注释规范

JavaScript 注释规范

该规范说明了书写 JavaScript 注释的一些约定。

需要注释的位置

  • 方法/函数前

注释说明

@ourai
ourai / recommendation.md
Last active December 20, 2015 12:09
前端开发资源推荐

前端开发资源推荐

这里收集了一些经过本人亲自试用验证过值得推荐的在前端开发过程中也许会用到的资源(工具、框架、库、插件等)。

数据可视化(Data visualization)

大数据

@ourai
ourai / flexible_image.md
Created June 13, 2013 03:01
自适应的九宫格图片

前提(要求)

  • 容器为九宫格,宽度根据页面自适应
  • 可为正方形、横向矩形或纵向矩形
  • 视觉显示必须为正方形,也就是相对短的边 100% 显示,相对长的边被容器遮住
  • 相对于容器水平垂直居中
  • 兼容 IE7+ 及其他浏览器
@ourai
ourai / table_layout.md
Last active December 18, 2015 00:28
用非 <table> 模拟表格行布局的几种方式,以及其优缺点。

前提(要求)

  • 不允许用 <table> 系列的标签
  • 每行三个单元格(三列)
  • 行内单元格的宽度总和不超过行容器
  • 左、右单元格的宽度根据自身内容自动调整
  • 中间单元格的宽度根据左、右单元格以及行容器的宽度自动调整
  • 行内单元格的(视觉上)高度相等
  • 左、右单元格的内容(视觉上)水平并垂直居中
  • 兼容 IE6+ 及其他浏览器