JavaScript “跑马灯”抽奖活动代码解析与优化（一）

最近的项目中做了一个“跑马灯”的抽奖特效插件。上篇文章已经分享过html和css 的相关知识。这篇文章主要分享一些 JavaScript 相关的知识。这几天在写这篇文章的时候，也顺便把自己的代码重构了一下。
这里主要是来写写自己的优化过程。俗话说：

一个程序猿的进步是从对自己的代码不满意开始的。

开始之前先来看上篇文章遗漏的两个问题和几个知识点，是自己重构的过程中需要用到的：

1.移动端1px像素线的问题

对于设计师给我的手机端网页的设计稿都是2倍图。按照道理来说，在写网页的时候，所有对象的实际尺寸都是会除2。但是对于1像素的线呢？
先来看两张图，设计稿的效果：

在三星 S4下的实际显示效果：

可以看到这个时候1px的线竟然显示不出来了。这个问题是跟 S4手机的屏幕像素密度有关。关于屏幕像素密度和1px 线的关系有很多文章介绍，可以自行搜索了解。我这里的解决方案是，对1px 的线不做处理。是多少就写多少。就算我的基础单位是rem，也不是其它单位。

{
    position: absolute;
    width: 13rem;
    height: 9.2rem;
    border:1px solid #000;
}

2.pc 端浏览器和移动端浏览器容错率的差异

先来看一段代码：

$('[node-type=row-a').find('div');