近期的js笔记，就是为了可以多看看以前不懂的地方

1、
//js实现保留两位小数
function returnFloat(value) {
???var value = Math.round(parseFloat(value) * 100) / 100;
???var xsb = value.toString().split(".");
???if (xsb.length == 1) {
???????value = value.toString() + ".00";
???????return value;
???}
???if (value.length > 1) {
???????if (xsb[1].length < 2) {
???????????value = value.toString() + "0";
???????}
???????return value;
???}
}
2、
//获取工程的全部工作的进度
function AllProjectList() {
???var xhr = new XMLHttpRequest();;
???var url = ‘http://10.122.84.35:8080/imp4sep/project/schedule/all?projectId=‘ + projectId + ‘&&stage=‘ + stageNumber;
???xhr.open("GET", url, false);//同步方式请求 ?
???xhr.onreadystatechange = function () {
???????if (xhr.readyState == 4 && xhr.status == 200) {
???????????var AllProject = xhr.responseText;
???????????//alert(AllProject);
???????????AllProjectInfo(AllProject);
???????}
???};
???//xmlHttp.open("GET", url, true);第三个参数为true为异步方式

3、
//js正则获取url参数值
function GetQueryString(name) {
???var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
???var r = window.location.search.substr(1).match(reg);
???if (r != null) return unescape(r[2]); return null;
}

4、
//封装函数记得需要return 该值；
//可设置为全局应用一个变量var tt = "";放到全局那里

5、
??//js设置cookie

???//设置cookie
???function setCookie(cname, cvalue, exdays) {
???????var d = new Date();
???????d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
???????var expires = "expires=" + d.toUTCString();
???????document.cookie = cname + "=" + cvalue + "; " + expires;
???}
???//清除cookie
???function clearCookie(name) {
???????setCookie(name, "", -1);
???}

//获取cookie
???function getCookie(name) {
???????var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");
???????if (arr = document.cookie.match(reg))
???????????return (arr[2]);
???????else
???????????return null;
???}
//js设置cookie end

6、
//js设置导航栏切换高亮
function MySelct(id) {
???if (ID != id) { ??//点击当前id的li无变化，点击其他id的li时启动if语句
???????var PreSect = document.getElementById(‘Sect‘ + ID); //不是id的的为非高亮，定义非高亮的上一个id
???????PreSect.className = "factive"; ????????????????????//赋予非高亮的class
???????var NowSect = document.getElementById(‘Sect‘ + id); //当前id的为高亮，定义当前id
???????NowSect.className = "active"; ??????????????????????//赋予高亮的class
???????ID = id; ??????????????????????????????????????????//把当前id赋值给ID ??
???}
}
html代码
<ul>
<li id=‘Sect0‘ class=‘active‘ ?onclick=‘MySelct(0)‘>核岛</li>
<li id=‘Sect1‘ ?onclick=‘MySelct(1)‘ ?>常规岛</li>
<li id=‘Sect2‘ ?onclick=‘MySelct(2)‘ >冷却塔</li>
<li id=‘Sect3‘ ?onclick=‘MySelct(3)‘ >泵房</li>
<li id=‘Sect4‘ ?onclick=‘MySelct(4)‘ >BOP</li>
<li id=‘Sect5‘ ?onclick=‘MySelct(5)‘ >管线</li>
</ul>

7、
//去除数组里重复的元素
function unique(arr) {
???var result = [];
???for (var i = 0; i < arr.length; i++) { ??//循环数组
???????if (result.indexOf(arr[i]) == -1) { ??//搜索是否有相同的匹配项
???????????result.push(arr[i]); ?????????????//把不相同的匹配项输进另一个数组里
???????}
???}
???return result;
}

8、toggle作用的点击效果
出错：
function SelectToggle(num) {
???document.getElementById(‘SelectDirectorOption‘ + num).onclick = function () {
???????if (document.getElementById(‘DirectorManage‘ + num).style.display == ‘none‘) {
???????????document.getElementById(‘DirectorManage‘ + num).style.display = ‘block‘;
???????} else {
???????????document.getElementById(‘DirectorManage‘ + num).style.display = ‘none‘;
???????}
???}
}
（出现第一次点击没效果，之后的点击可以起作用）原因：文本首先对句子做判断，样式的（display：none）不一定起作用（行内样式才是js的样式）所以第一次的判断为错的，然后返回（dispaly:none）
修改：
function SelectToggle(num) {
???document.getElementById(‘SelectDirectorOption‘ + num).onclick = function () {
???????if (document.getElementById(‘DirectorManage‘ + num).style.display == ‘block‘) {
???????????document.getElementById(‘DirectorManage‘ + num).style.display = ‘none‘;
???????} else {
???????????document.getElementById(‘DirectorManage‘ + num).style.display = ‘block‘;
???????}
???}
}

9、数组里多个对象
//正确
function SelectTestMultiple(count) {
???var SelectMultiple = [];
???for (var i = 0; i < 3; i++) {
???????var SelectObj = {};（正确方式）
???????????SelectObj.userid = MultipleVal1[i];
???????????SelectObj.name = MultipleArr1[i];
???????????SelectObj.flag = count;
???????????SelectMultiple.push(SelectObj);
???????}
???return SelectMultiple;
}
//错误
function SelectTestMultiple(count) {
???var SelectMultiple = [];
???????var SelectObj = {};（错误方式）
???for (var i = 0; i < 3; i++) {
???????????SelectObj.userid = MultipleVal1[i];
???????????SelectObj.name = MultipleArr1[i];
???????????SelectObj.flag = count;
???????????SelectMultiple.push(SelectObj);
???????}
???return SelectMultiple;
}

10.下面的代码将输出什么到控制台，为什么：
var hero = { ??
???_name: ‘John Doe‘, ??
???getSecretIdentity: function (){ ??
???????return this._name; ??
???} ??
}; ??

var stoleSecretIdentity = hero.getSecretIdentity; ??

console.log(stoleSecretIdentity()); ??
console.log(hero.getSecretIdentity());
代码有什么问题，以及应该如何修复。

代码将输出：
undefined ??John Doe
第一个 console.log之所以输出 undefined，是因为我们正在从 hero对象提取方法，
所以调用了全局上下文中（即窗口对象）的 stoleSecretIdentity()，而在此全局上下文中， _name属性不存在。

11.时间格式转换成yyyy-MM-dd
//yyyy-MM-dd的时间格式转换
Date.prototype.Format = function (fmt) { //author: meizz
???var o = {
???????"M+": this.getMonth() + 1, //月份
???????"d+": this.getDate(), //日
???????"h+": this.getHours(), //小时
???????"m+": this.getMinutes(), //分
???????"s+": this.getSeconds(), //秒
???????"q+": Math.floor((this.getMonth() + 3) / 3), //季度
???????"S": this.getMilliseconds() //毫秒
???};
???if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
???for (var k in o)
???????if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
???return fmt;
}

var date = new Date().Format("yyyy-MM-dd");\\

12.JS按回车键实现登录的方法
<body onkeydown = "on_return();"></body>
function on_return (){
??if(window.event.keyCode == 13){
????document.all(‘login_btn‘).click();
}
}

13.内嵌和并列的bug
//初可研厂址内容块
function ScgeduleAdress(address, InfoArrSchedule) {
???var Html = "";
???Html += "<div class=‘project_group schedule_echart clearfix‘>"
???Html += "<div class=‘form_group fl‘><span class=‘item_info_name‘>厂址：</span><span class=‘item_info MaxLen_limit‘>" + address + "</span></div>";
???Html += "<div class=‘form_group fl‘>";
???Html += "<span class=‘item_info fl‘>工作进度</span><span class=‘item_info progress_value fl‘>" + InfoArrSchedule + "%</span><div class=‘fl loader loader4 duration-2s-after leader_schedule_left‘><a href=‘javascript:;‘>" + InfoArrSchedule + "%</a></div> ";
???Html += "</div>(这里就是少了个</div>所以内容没包住，生成新的内容块不断的内嵌，而不是并列的关系，加个</div>即可解决问题)";
???return Html;
}

14.闭包函数
???　　var name = "The Window";
　　var object = {
　　　　name : "My Object",
　　　　getNameFunc : function(){
　　　　　　return function(){
　　　　　　　　return this.name;

　　　　　};
　　　　}
};
alert(object.getNameFunc()()); //The Window
注意：1.子对象会一级一级地向上寻找所有父对象的变量。所以，父对象的所有变量，对子对象都是可见的，反之则不成立
2.在nAdd前面没有使用var关键字，因此 nAdd是一个全局变量，而不是局部变量。其次，nAdd的值是一个匿名函数（anonymous function），而这个

匿名函数本身也是一个闭包，所以nAdd相当于是一个setter，可以在函数外部对函数内部的局部变量进行操作。

15.设置checked="checked"无效，radio未选中！
?????<div class="form_group radio_leader_h fl">
???????<label for="" class="label_name"><input type="radio" value="" class="number_radio" name="visible1" id="twoProgramsEditChecked1" checked="">正在编制</label>
???????<label for="" class="label_name"><input type="radio" value="" class="number_radio" name="visible1" id="twoProgramsEditChecked2" checked="">完成编制</label>
?????</div>

?js代码： document.getElementById(‘twoProgramsEditChecked1‘).checked = true;（bug：有时候不起作用）
错误的原因：是name设置的问题,与页面中部分radio出现重复，修改换成name=""不出现重复即可。

16.id的引号引起的bug
surveyHtml += "<input type=‘text‘ class=‘choose_company ?" + Name + "‘ value=‘" + workType + "‘ placeholder=‘‘ readonly ?name= ‘" + typeNumber + "‘;‘ onclick=‘SelectOtherToggle(AllDir" + IDCName + ");‘>"; ??（X）两种方式都会出错
surveyHtml += "<input type=‘text‘ class=‘choose_company ?" + Name + "‘ value=‘" + workType + "‘ placeholder=‘‘ readonly ?name= ‘" + typeNumber + "‘;‘ onclick=‘SelectOtherToggle(‘AllDir" + IDCName + "‘ );‘>"; ?(X)
?
function SelectOtherToggle(NameList) {
???//alert(document.getElementById(NameList));
???if (document.getElementById(NameList).style.display == ‘block‘) {
???????document.getElementById(NameList).style.display = ‘none‘;
???} else {
???????document.getElementById(NameList).style.display = ‘block‘;
???}
}
显示出错，alert(document.getElementById(NameList));弹出为null；获取不到id
bug解答：document.getElementById(NameList)里面的NameList的值是需要加引号的，不然获取不到该id值（类似于document.getElementById(‘name’)）所以文档里的应该加转义字符双引号（\"），单单加双引号是会出错的，所以修改成
???surveyHtml += "<input type=‘text‘ class=‘choose_company ?" + Name + "‘ value=‘" + workType + "‘ placeholder=‘‘ readonly ?name= ‘" + typeNumber + "‘;‘ onclick=‘SelectOtherToggle(\"AllDir" + IDCName + "\" );‘>";

17.js中function的参数是数组，要怎么传参
bug解答：直接传参会出错，显示SelectDirectorId(1, "SetNameEngSurvey", 收资,地形测量（面）,地形测量（线）,钻孔放样,断面测量, "-", this);就变成了一个个变量参数；
正确传参应该是SelectDirectorId(1, "SetNameEngSurvey", ["收资","地形测量（面）","地形测量（线）","钻孔放样","断面测量"], "-", this);
所以：
1.第一张方法不能直接传呀，需要传fun([[1,2,3]]),如果直接传[1,2,3]的话，对于js来说就相当于直接将arguments数组赋值成了[1,2,3]，那么传递的就不是一个数组了，就是单独的三个参数
2.把menu= ["收资","地形测量（面）","地形测量（线）","钻孔放样","断面测量"];变成json数据再传进去
var engineerMenuJson = JSON.stringfy(menu);
surveyHtml += "<li value=‘" + (k + 1) + "‘ onclick = ‘SelectDirectorId(" + count + ", \"" + Name + "\", " + engineerMenuJson + ", \"" + units + "\", this);‘>" + engineerMenu[k] + "</li>";

18.判断input的type=“radio”
js判断checked是否选中时，用id.checked = true/false;来判断
HTML内的checked是否选中用去掉“checked”和加上“checked”来判断；

19.进行ajax数据交互时，提交的json格式的数据没有错时还返回415时可以考虑一下是不是 xhr.setRequestHeader("Content-type", " application/x-www-form-urlencoded");是否为json格式的xhr.setRequestHeader("Content-type", "application/json");

链接（https://www.cnblogs.com/SamWeb/p/6211134.html）

json格式的数据为
var EditStageAllDate = {}; //创建一个对象
???????EditStageAllDate.nuclearPlantsId = NuclearPlantsCount; //核电站id
???????EditStageAllDate.stageNumber = CreatestageCount; //所处阶段
???????EditStageAllDate.projectName = CreateProjectName; //工程名字
???????EditStageAllDate.projectNumber = CreateprojectNumber; //工程编号
???????EditStageAllDate.commencementDate = commencementDate; //开工时间
???????EditStageAllDate.actualizationDept = actualizationDept; //实施单位
???????var EditStageAllDateJson = JSON.stringify(EditStageAllDate);
???????alert(EditStageAllDateJson);
???????xhr.send(EditStageAllDateJson);

20.ajax提交数据被截断的问题
最近做一个博客发布程序，使用ajax向后台提交数据，发现数据总是被截断，网上搜了些资料，罪魁祸首是特殊字符转义后的&惹的祸，现将解决办法记录下，以备后查

获取数据:

var data=ckeditor.getData();

方式一、用encodeURIComponent编码

data=encodeURIComponent(data);
方式二、ajax form验证

data=$("#from").serialize();
ajax提交如下

复制代码
data="param="+data;
$.ajax({
???type:"POST",
???url:"test",
???data:data,////如果包含&字符的字符串会出现错误
???success:function(str){
?????......
???}
?});
复制代码
方式三，使用{"":""}组合数据

复制代码
$.ajax({
???type:"POST",
???url:"test",
???data:{"param":data},//使用此方式提交可避免字符串中特殊字符带来的数据截断的问题
???success:function(str){
??????......
???}
?});
复制代码

21.关于javascript中的call方法，网上查了一些资料总是不得详解。总结网上的观点，call有两个妙用：

???????1: 继承。(不太喜欢这种继承方式。)

???????2: 修改函数运行时的this指针。

????var func1 = function(arg1, arg2) {};
通过 func1.call(this, arg1, arg2);
或者 func1.apply(this, [arg1, arg2]); 来调用

call 需要把参数按顺序传递进去，而 apply 则是把参数放在数组里。
JavaScript 中，某个函数的参数数量是不固定的，因此要说适用条件的话，
当你的参数是明确知道数量时，用 call，而不确定的时候，用 apply，然后把参数 push 进数组传递进去.

22.<iframe>标签可以在一个页面的div中嵌入另一个页面，如：

<iframe src="http://baidu.com" width="500px" height="500px"></iframe>；

<object>标签主要用来包含对象，比如图像、音频、视频、Java applets、ActiveX、PDF 以及 Flash，

同时在标签内有个属性data，可以连接到URL，可以替代<iframe>标签在页面中嵌入一个子页面，如：

<object data="http://www.baidu.com" width="500px" height="500px"></object>

23.箭头函数简写

传统函数编写方法很容易让人理解和编写，但是当嵌套在另一个函数中，则这些优势就荡然无存。

function sayHello(name) { console.log(‘Hello‘, name);}
setTimeout(function() { console.log(‘Loaded‘)}, 2000);
list.forEach(function(item) { console.log(item);});
简写：
sayHello = name => console.log(‘Hello‘, name);
setTimeout(() => console.log(‘Loaded‘), 2000);
list.forEach(item => console.log(item));