11 2016 档案
摘要：事件逻辑： 1.用户在输入框输入文字后 2.将输入的文字与后台数据做查询 .push() push() 方法可向数组的末尾添加一个或多个元素，并返回新的长度。 3.查询到后返回给客户端 4.然后将返回的数据显示在数据列表下 完整案例：
阅读全文
摘要：scrollIntoView(ture)元素上边框与视窗顶部齐平 scrollIntoView(false)元素下边框与视窗底部齐平 HTML5_ScrollInToView方法 scrollIntoView(false) scrollIntoView(true) scrollIntoView(ture)元素上边框与视窗顶部齐平 ...
阅读全文
摘要：获取滚动条位置(scrollTop) 获取可视窗口高度(viewportHeight) 获取整个页面可滚动高度（scrollHeight） 当scrollTop+viewportHeight==scrollHeight时，表明已经滚动到底部 滚动到底部时调用你的加载代码
阅读全文
摘要：2.考虑到如果li是动态的添加； 可以把事件绑定在ul上，多次的事件不用在每个li绑定，而是用on一次绑定在ul上，提高了性能；
阅读全文
摘要：首先截取的方法有： 最直接的方法：.substr() .slice() .substring() 间接方法是根据字符的位置截取：1，charAt() 方法可返回指定位置的字符。2，split() 方法用于把一个字符串分割成字符串数组。 很显然，前两个方法最为简洁，这里我选择用.slice(); 应用
阅读全文
摘要：目的：记录中展现“今天”，“明天”，除外展现月日。 借鉴： 改后我需要的： 逻辑：我需要获取今天的时间day1，还需要会议的时间day2；将两个时间相减去，day1-day2值为0,显示今天；值为-1时，显示明天；值为这两种值之外，显示月，日。 进一步参考：
阅读全文
摘要：表单内容验证：1，阻止用户输入非法字符 ------阻止事件2，输入时，失去焦点时验证-------onkeyup,onblur3,提交时检查-----------------onsubmit*后台数据检查。 Title 用户： 密码： 表单内容验证： 1，阻止用户输入非法字符 ------阻止事件 2，输入时，失去焦点时验...
阅读全文
摘要：一表格简化写法到认识：tBodies,rows,cells 结构： 四，表格的添加： 五，删除 六，搜索：所谓搜索就是一行一行的比较； toLowerCase() ,toUpperCase() 七、多关键词搜索：循环所有的行，搜索姓名。 slipt(' ') :暂且认为用户用空格来分隔关键词 .se
阅读全文
摘要：轻量基础库、方法库 用时可直接拷贝 拆卸式使用 适用于mobile端简单页面 适用于PC简单页面 基于node、php等多种构建方法 下载地址：https://github.com/dorsywang/util.js 项目中看到的部分util.js： 效果在：http://ueditor.baidu
阅读全文
摘要：一，定义 prop() 方法设置或返回被选元素的属性和值。prop() 方法应该用于检索属性值 attr() 方法设置或返回被选元素的属性和值。如需检索 HTML 属性，请使用 attr() 方法代替。 固有属性用prop方法； 自定义属性用attr方法。 典型的例子：判断checkbox是否选中
阅读全文
摘要：Drag.js LimitDrag.js html
阅读全文
摘要：出现的问题，子类影响了父类的东西，这里就说到了引用。ex： 其中 for(var i in Person.prototype){Worker.prototype[i]=Person.prototype[i];//用原型链来继承父级的方法} 是复制了一份Person的方法到worker中。 补充：in
阅读全文
摘要：p1-- JSON对象名称 name-- 属性名称 showName -- 函数名称 补充json {}里面包括一组键值对，值可以表示为”值”或者[]， []里面可以有数个{}。 JSON结构有两种结构 json简单说就是javascript中的对象和数组，所以这两种结构就是对象和数组两种结构，通过
阅读全文
摘要：都有隐藏节点的作用。 visibility:hidden; display:none; （1）visibility 规定了元素是否可见，即使不可见也会占用上面的空间，在这里就是在指它与display的不一样了。 （2）display 这个属性用于定义建立布局时元素生成的显示框类型。对于 HTML 等
阅读全文
摘要：em是相对于父元素的font-size，rem是相对于根元素的font-size。 rem的补充： ① 对于不支持它的浏览器，应对方法也很简单，就是多写一个绝对单位的声明。这些浏览器会忽略用rem设定的字体大小； ② IE9/IE10在用于伪元素时或者使用字体简写声明时不支持rem； ③ IOS S
阅读全文
摘要：标记短的引用，默认是中文符号：双引号 如果是在html里直接敲出引号，是这样的： 如果想要改变默认的引号符号，可以用属性lang：
阅读全文
摘要：容器属性: 左右对齐方式：justify-content:flex-start/flex-end/center/space-between/space-around; 上下对齐方式：align-items:flex-start/flex-end/center/baseline/stretch 其中，
阅读全文
摘要：this什么时候会出错？ 注意：其中var _this = this 的巧妙用法。 1.定时器； 2.事件；
阅读全文
摘要：普通函数改写为构造函数。 前提： 1.所有的东西都在onload里； 2.不能有函数嵌套，可以有全局变量； 改写过程： 3. 解决this问题： 最后：完整案例：
阅读全文
摘要：scrollTop和animate的结合，使页面平滑滚动； 参考 WEB前端 伯乐在线 ：http://web.jobbole.com
阅读全文
摘要：记忆： 一.这里用到了jQuery遍历 filter()方法； filter() 方法将匹配元素集合缩减为匹配指定选择器的元素。 二.HTML DOM hash属性 hash 属性是一个可读可写的字符串，该字符串是 URL 的锚部分（从 # 号开始的部分）。 可能会出现的形式： this.hash：
阅读全文
摘要：生存环境主要分为三个维度： 硬件环境，细分为品牌和机型，决定了屏幕大小、性能等硬件限制 操作系统，比如iOS6和iOS7，或者安卓各家的定制系统的不同版本 浏览器，主要分为App容器，原生浏览器，各品牌浏览器
阅读全文
摘要：参考文章： https://www.w3ctech.com/topic/1930 前端性能优化可以分为三个level：静态资源优化、接口访问优化、页面渲染速度优化，在操控门槛上依次递增，优化效果上越发没有这么明显，所以很多小团队只会做到了第一个level 追求极致的前端性能体验，提升自己的level
阅读全文
摘要：构造对象 混合法 3.this this:是当前的方法属于谁，（全局函数是window的方法） 补充，window：全局函数是window的方法：上面的全局函数等价于： 4.了解工厂方式来构造对象： 5，理解new 创建一个新的对象。 通过var this=new Object();自动创建，来给函
阅读全文
摘要：稳定、快速、免费的开源项目 CDN 服务 BootCDN： jQuery3 <script type="text/javascript" src="http://cdn.bootcss.com/jquery/3.1.1/jquery.js"></script> bootstrap-css <link
阅读全文
摘要：一、分页元素： pageNo：当前页 pageSize：每页渲染个数 count：总数据； pageCont:渲染的总页数。=count/pageSize； pageNum:初始化的显示页码。比如当前页为1的时候，显示的页数是5页，pageNum=5,这个值可以是个定值，也可以不是； 求取总页数：
阅读全文
摘要：function startMove(obj,attr,iTart) {//物体，属性，目标值 clearInterval(obj.time);//注意，首先要清除定时器 obj.time = setInterval(function () { var iCur = 0;//当前非行间样式的值 if(att...
阅读全文
摘要：display:box;box-flex 是css3新添加的盒子模型属性，它的出现可以解决我们通过N多结构、css实现的布局方式。经典的一个布局应用就是布局的垂直等高、水平均分、按比例划分 目前box-flex属性还没有得到firefox、Opera、chrome浏览器的完全支持，但可以使用它们的私
阅读全文
摘要：三、js解决方案： 一、js的解决方案： clamp.js 引用： 注意：用这个方法，一定要给文字加行高。 四、jq的dotdotdot.js http://dotdotdot.frebsite.nl
阅读全文
摘要：解决办法，给display：inline-block的父元素上加font-size:0; 未添加font-size：0：如下图： 添加font-size：0后，如下图：
阅读全文
摘要：如果把line-height加1px，iPhone文字就会下移，由于我们app的ios用户居多，并且android机型太多，不同机型也会显示不同，所以只能退而求其次了。 line-height的兼容问题不太好解决，容器高度越小，显示效果的差距越明显。稍微大一点的高度，最好把line-height设置
阅读全文
摘要：function $(id){ return document.getElementById(id); }
阅读全文
摘要：一，内联元素的垂直居中之图片 查了多方资料，最终觉得淘宝工程师的做法更能满足我的需求，于是把它记录在此： 铺垫：vertical-align 这个属性的特点，它是相对兄弟级(line-height)来定位的，并且它仅对行内元素有效； display:table-cell属性指让标签元素以表格单元格的
阅读全文
摘要：桌面端开发中，meta标签通常用来为搜索引擎优化（SEO）及 robots定义页面主题，或者是定义用户浏览器上的cookie；它可以用于鉴别作者，设定页面格式，标注内容提要和关键字；还可以设置页面使其可以根据你定义的时间间隔刷新自己，以及设置RASC内容等级，等等。 移动端开发中，meta标签除了桌
阅读全文
摘要：运动终止条件： 匀速运动：距离足够近，常常用到Math.abs(); 缓冲运动，两点重合，常常用到 Math.ceil(); Math.floor(); 匀速运动： 缓冲运动：
阅读全文
摘要：采用的是类名的字符拼接 ，在setTab(name,num,n)方法中，传入部分共用的名字，当前的i==num的时候，n总个数（用于遍历出多有tab头和tabbox）：
阅读全文
摘要：.css{filter:alpha(opacity:30);/*filter是给IE用到*/opacity:.3; }
阅读全文
摘要：思考： 不会停止，if（）解决； 速度取某些值的时候无法停止，注意条件==300，速度为7的时候就无法停止，解决：选择区间范围； 到达300的时候，还会运动。else解决； 重复点击的时候速度加快，这是因为每次点击，都开启了一次定时器，故而在事件开始的时候就要加clearInterval(time)
阅读全文
摘要：帮助理解： 最外层： 其中包括header，body，footer; .box .header{height:40px;}
阅读全文
摘要：order flex-grow flex-shrink flex-basis flex align-self 1.1 order css order属性规定了弹性容器中的可伸缩项目在布局时的顺序。元素按照order属性的值的增序进行布局。拥有相同order属性值的元素按照它们在源代码中出现的顺序进行
阅读全文
摘要：一个高度为100px， 另外一个高度自动补全当前界面下剩余的高度：
阅读全文
摘要：一，概念 flexible box ,意为“弹性布局”，用来为盒状模型提供最大的灵活性。 块级布局更侧重于垂直方向，行内布局更侧重于水平方向，于此相对的，弹性盒子布局算法是方向无关的。 块级flex布局： 行内元素flex布局： webkit内核的浏览器，必须加上-webkit前缀： 注意：设为fl
阅读全文
