2016年11月_Mr_董

原创前端常用技术之图片懒加载

目前，一些图片类型的网站上，在图片加载时均采用了一种名为懒加载的方式，具体表现为，当页面被请求时，只加载可视区域的图片，其它部分的图片则不加载，只有这些图片出现在可视区域时才会动态加载这些图片，从而节约了网络带宽和提高了初次加载的速度，。避免网页打开时加载过多资源，让用户等待太久。图片懒加载实例 * { margin:

2016-11-29 08:36:32 3112

原创 js判断数组或对象中的key是否存在

JS中数组和对象是等同的，判断一个key是否存在于数组中(或对象是否包含某个属性)，我们可能马上想到的是使用ary[key] == undefined来判断key是否存在这个数组或者是对象中，但是这样判断是有问题的，因为可能存在ary = {key:undefined};正确的方法应该为：ary.hasOwnProperty(key); 或 obj.hasOwnProperty(k

2016-11-28 08:49:45 149631 8

原创 angularjs中的常见过滤器

项目中使用了angularjs框架，使用到了里面自带过滤器，随便就总结了一下angularjs中常见的过滤器。一、什么是过滤器？过滤器用来格式化需要展示给用户的数据。AngularJS有很多实用的内置过滤器，同时也提供了方便的途径可以自己创建过滤器。在HTML中的模板绑定符号{{ }}内通过|符号来调用过滤器。例如，假设我们希望将字符串转换成大写，可以对字符串中的每个字符都单独进

2016-11-24 09:19:10 2386

原创 http状态码大全

HTTP状态码当浏览者访问一个网页时，浏览者的浏览器会向网页所在服务器发出请求。当浏览器接收并显示网页前，此网页所在的服务器会返回一个包含HTTP状态码的信息头（server header）用以响应浏览器的请求。HTTP状态码的英文为HTTP Status Code。下面是常见的HTTP状态码：200 - 请求成功301 - 资源（网页等）被永久转移到其它U

2016-11-23 16:32:12 330

原创 javaScript中数组的方法

一、数组对象的3个属性1、length 属性Length属性表示数组的长度，即其中元素的个数。因为数组的索引总是由0开始，所以一个数组的上下限分别是：0和length-1。和其他大多数语言不同的是，JavaScript数组的length属性是可变的，这一点需要特别注意。当length属性被设置得更大时，整个数组的状态事实上不会发生变化，仅仅是length属性变大；当length属性被设置得

2016-11-23 11:40:36 291

转载前段优化之雅虎的34条军规

雅虎给出了优化网站加载速度的34条法则（包括Yslow规则22条）详细说明，下载转发 ponytail 的译文（来自帕兰映像）。1.Minimize HTTP Requests 减少HTTP请求图片、css、script、flash等等这些都会增加http请求数，减少这些元素的数量就能减少响应时间。把多个JS、CSS在可能的情况下写进一个文件，页面里直接写入图片也是不好的做法

2016-11-23 09:07:10 527

原创 angularJs中的ng-repeat的使用

最近项目中要求做一个下拉的城市选择的功能，由于项目使用了AngularJs框架，所以自然而然的想到ng-repeat指令，免去了自己写循环的烦恼。所以总结一下ng-repeat的使用方法：代码如下html ng-app>head> meta charset="utf-8"> title>ng-repeat directivetitle>head>body>ta

2016-11-22 08:36:35 2639

原创 SelecT下拉框选中和取值的方法

Select下拉框的问题，想在选择一个选项后，前台显示做出变动，并且知道选择的是第几个选项。这个很好解决：如下:div class="page-header"> div class="form-horizontal"> div class="control-label col-lg-0"> div> div class="col-lg-2">

2016-11-22 08:24:10 5557

原创 js设置ios中微信浏览器的title

说到web前端，浏览器差异是不可回避的问题，这次在项目就遇到下面的问题：微信导航栏的内容是直接拿的项目中title来设置的。但是现在做的项目是一个单页应用，整个页面只会在第一次完全刷新，后面只会局部刷新，所以只能在页面刷新的时候通过js动态修改title。开始我们使用的做法如下： document.title = "微信导航栏想要显示的内容";$("title").text("

2016-11-16 16:35:17 2131 1

原创 css实现垂直居中和水平居中的方法

一、 CSS 来实现对象的垂直居中的几种不同方法。 1、使用表格的 vertical-alignproperty属性。 Content goes here #wrapper { display: table;}#cell { display: table-cell; vertical-alig

2016-11-16 13:39:08 881

翻译 javascript的字符串方法方法

1.str.length()获取字符串的长度 2.str.charAt(i)获取相应位置的字符（i不写时默认0，超过字符串本身长度时返回空） 3.str.charCodeAt(i)获取相应位置字符的unicode编码，不写时i默认为0 4.String.fromCharCode()，根据传入的编码值返回相应的字符，可以传入多个编码，用“,”分开。（此方法为静态方法，String不能缺省

2016-11-16 09:04:08 390

原创 angularjs自定义过滤器

AngularJS一大特点就是提供了过滤器，可以通过操作UNIX下管道的方式，操作数据结果。通过使用管道，可以便于双向的数据绑定中视图的展现。过滤器在处理过程中，将数据变成新的格式，而且可以使用管道这种链式风格，还能接受附加的参数。实现方式下面看一下如何定义声明一个过滤器，首先依然是要创建我们自己的模块myAppModulevar myAppModu

2016-11-15 17:27:31 415

最近在做一个项目需求，需要实现一个类似谷歌搜索的功能，可以模糊匹配到中文和字母。当时想到了keyup事件，每当键盘按下时监控input框值的变化，在电脑和安桌手机上测试都没有问题。直接提交完系统测试，系统测试发现在ios上有问题，对于输入中文keyup事件无法监听到中文的内容变化，没想到在测试的时候遇到这么一个坑，后来在改成这样ios和安卓都没有问题完美解决，同时还发现类似于这种匹配的功能，最好加

2016-11-15 16:55:21 6905

转载 webApp开发心得

从事单页相关的开发一年有余，期间无比的推崇webapp的网站模式，也整理了很多移动开发的知识点，但是现在回过头来看，webapp究竟是好还是不好真是一言难尽哟！webapp使用JavaScript修改页面；紧接着再从服务器传递更多数据然后再修改页面，如此循环。从性能的角度看，在现代浏览器中单页面Web App已经能够和普通native应用程序相媲美，而且几乎所有的操作系统都支持现代

2016-11-03 15:13:51 19094

原创 input type=number验证问题

input type=number 中可以随意输入任意字符，但是如果该字符不是纯数字（负数，小数也行），对应dom元素的value就是空（""），这个事情非常坑，会导致验证的时候如果输入非数字的时候，直接.value( 或者$('.selector').val() )拿不到值，而拿不到值的情况下会认为没有填写，这样我就无法区分用户到底是输入了一些非法的字符如（20A)还是把input清空了。如

2016-11-02 16:17:12 8455 2

原创在webview中 input=number类型的问题

最劲，项目投产上线，在生产验证的过程中出现了一些小问题。其中一个就是type=number的问题。项目中前段要向后台服务器提交一个金额的字段，需要可以输入小数，其中输入框选择了type=number类型；但是在表单输入的过程中发现安卓手机对于number类型支持较弱，有的手机不能输入小数点，后来研究了一下解决了；如果想要输入小数可以设置步数，也就是step="0.01"解决了，是不是很简单；

2016-11-01 11:17:17 2699

大董的博客