前台开发总结05_20170516

1、 问题描述：
在前台开发中，经常需要通过点击按钮，为HTML的某一元素增删class中的值。过去通常通过jQuery的attr()方法设置指定元素的class值。但是，这种方法在对元素的类属性处理上，很不方便。
解决方法：

可以使用jQuery的addClass()、removeClass()、toggleClass()来具体的增删元素中的class

或者使用JS的classList中的add()、remove()、toggle()

2、HTML中<a>中有属性download，加上它可以实现<a>中href属性所指向文件的下载。

eg. <a href="test.jpg" download>

若给download指定值，那么便可以给test.jpg重命名, 此功能只作用于同域，跨域无效。

3、在HTML页面的密码输入框中，通常需要设计显示隐藏密码的按钮或图标。
可以通过设置type来控制输入框中的字符串是否显示。
代码：

<input type="password" name="" id="password">
<input type="button" value="显示/隐藏" class="but13">
<script>
	$(function(){
		$(".but13").click(function(){
			var inputType=$("#password").attr("type");
			if("password" == inputType){
				$("#password")[0].type="text";
			}else{
				$("#password")[0].type="password";
			}
		});
	});
</script>

4、JS中使用 document.write("测试值"); 可以将JS中的变量输出到页面上。
注意：该表达式最好在测试中显示变量使用，因为其在显示时，会将原先的页面内容清空。

5、eval(); 参数只能为原始字符串，如果传入对象，则会不作任何改变的返回。
eval(); 参数中定义的值为全局变量。
抛出
如果参数中没有合法的表达式和语句，则抛出 SyntaxError 异常。
如果非法调用 eval()，则抛出 EvalError 异常。
如果传递给 eval() 的 Javascript 代码生成了一个异常，eval() 将把该异常传递给调用者。

6、使用eval()、setTimeout()、setInterval()会对JS的性能造成影响，因为该三者的作用域都为全局，建议使用New Function立即执行函数，代码如下所示，其作用域为方法体。

eg. (function(){})();

7、parseInt(); 可以将变量从字符串类型转换为Number类型，如果为'a'这种无法转换为Number的字符串类型变量，则会返回NaN (Not a Number)。
注意：使用 parseInt(); 最好传递两个参数，第一个为要转换的字符串，第二个为进制。否则，若你的JS引擎的标准低于ECMAScript 5，parseInt('09'); 八进制以0开头，09会被当成八进制，进而出错转化为0。
ECMAScript 6 标准具有新的方法——— isNaN(); 可以判断String类型的变量能否转化为Number类型。

parseInt("10");			//返回 10
parseInt("19",10);		//返回 19 (10+9)
parseInt("11",2);		//返回 3 (2+1)
parseInt("17",8);		//返回 15 (8+7)
parseInt("1f",16);		//返回 31 (16+15)
parseInt("010");		//未定：返回 10 或 8

使用isNaN()判断是否为非数字。注意，isNaN()会先将参数转换为Number，再进行判断是否为非数字。因此，判断boolean和空字符串会返回false；

isNaN('asd');    //true
isNaN(true);     //false
isNaN("")        //false

在ES6中，可以使用isNaN()判断变量是否为非数字，那么在此之前呢？要知道NaN==NaN的结果可以为false的

解决方法 

var isNaN = function(value) {
    var n = parseInt(value);
    return n !== n;
};

8、在JS的书写中，每条语句的结尾使用 ';'或者【Enter】回车 都可以表示语句的结束。不过，为了JS的规范，这里建议使用 ';' 作为语句的结束。

注意：不要因为无意中的回车而阴式添加分号，示例如下所示。

eg. function ma(){
	……
	return
	{
		value:'test'
	};
}

//本来想返回对象，结果却造成返回值为null。

9、JS变量声明规范
对于JS中的常量，变量名全部大写，

eg. var PI =3.14;

对于JS中的私有(局部)变量，以下划线开始。

eg. var _pri_test ="test";

在JS中声明变量时，无论全局变量还是局部变量，最好将所有变量都放在作用域的顶部声明，防止声明提升对代码逻辑造成影响。