近期的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));