js常见的排序方法
冒泡排序
冒泡排序作为常见的排序方法，就是每次比较相邻两个数字的大小，将大的放在后面，依次类推，后面一个就是大的。然后依次往前排序。
var arrayOne = [5, 8, 6, 4, 3, 1, 2, 9, 7]; console.log(arrayOne); var templateVal = ""; // 冒泡排序就是将一组数组进行从小到大或是从大到小的排列方式。 for (var i = 0; i < arrayOne.length; i++) { for (var j = i + 1; j < arrayOne.length; j++) { if (arrayOne[i] > arrayOne[j]) { templateVal = arrayOne[i]; arrayOne[i] = arrayOne[j]; arrayOne[j] = templateVal; } } } console.log(arrayOne);选择排序
选择排序就是每次循环对比选择一个小值，然后将小值依次排列即可得到新的排列好的数组；
// 选择排序 var arrayOne = [5, 8, 6, 4, 3, 1, 2, 9, 7]; console.log(arrayOne); var templateindex = ""; var templateVal = ""; for (var i = 0; i < arrayOne.length; i++) { templateindex = i; for (var j = i + 1; j < arrayOne.length; j++) { if (arrayOne[j] < arrayOne[templateindex]) { templateindex = j; } } if (templateindex != i) { templateVal = arrayOne[templateindex]; arrayOne[templateindex] = arrayOne[i]; arrayOne[i] = templateVal; } } console.log(arrayOne);插入排序
插入排序是从第二位数开始与之前的所有数字从位进行比较，如果当前数小于对比的书；就拿当前数放在该数之前；
// 插入排序 var arrayOne = [5, 8, 6, 4, 3, 1, 2, 9, 7]; console.log(arrayOne); var templateindex = ""; var templateVal = ""; for (var i = 1; i < arrayOne.length; i++) { for (var j = 0; j < i; j++) { if (arrayOne[i] < arrayOne[j]) { templateVal = arrayOne[i]; arrayOne[i] = arrayOne[j]; arrayOne[j] = templateVal; } } } console.log(arrayOne);前段常见的循环方法
for 循环
var arrayOne = [5, 8, 6, 4, 3, 1, 2, 9, 7]; for (var i = 0; i < arrayOne.length; i++) { console.log("当前的索引为：" + i); console.log("当前索引的值为：" + arrayOne[i]); }while 循环
只要判断条件为 true ，程序就会一直执行；
var text = ""; var a = 0; while (a < 10) { text = "目前a的值为" + a console.log(text); a++; }Do-while 循环
注意：与while不同的是,do while先不进行判断,直接先将循环体中的代码执行一遍,然后根据while中的条件的返回值判断,如果符合条件,则再一次运行循环体,如果不符合,则执行do while外面的代码
var text = ""; var a = 0; do { text = "目前的值为" + a console.log(text); a++; } while (a < 10);Jquery $.each() 循环
var arr1 = ['aa', 'bb', 'cc', 'dd']; $.each(arr1, function(i, val) { console.log("当前的索引为：" + i); console.log("当前索引的值为：" + val); })两个关键字： break, continue
Break的用法：
1. 用于跳出switch-case 语法结构
2. 用于跳出循环，break后面的代码不再执行
Continue:
用于结束本次循环，回到判断条件处，判断循环条件是否成立，如果成立，再进行下一次循环，如果条件不成立，再跳出当前循环，continue后面的代码也不会执行。
innerHTML ，innerText，textContent对比
- innerHTML
innerHTML 属性设置或返回表格行的开始和结束标签之间的 HTML。
语法： HTMLElementObject.innerHTML=text
<body> <div> <span> <span> 武林，宝刀屠龙，号令天下，谁敢不从！</span> <div>倚天不出，谁与争锋；</div> </span> <br> <input type="button" value="点击html" onclick="htmlGetClick()"> <input type="button" value="设置html" onclick="htmlSetClick()"> </div></body></html><script> var spanArr = document.getElementsByTagName("span") function htmlGetClick(){ var inHtml = spanArr[0].innerHTML; console.log(inHtml); // <span> 武林，宝刀屠龙，号令天下，谁敢不从！</span> // <div>倚天不出，谁与争锋；</div> } function htmlSetClick(){ spanArr[0].innerHTML = "人间绝品应难识，闲对茶经忆友人<br>一杯永日醒双眼，草木英华信有神"; // 人间绝品应难识，闲对茶经忆友人 // 一杯永日醒双眼，草木英华信有神 }</script>- innerText
var renderedText = HTMLElement.innerText;
HTMLElement.innerText = string;
<body> <div> <span> <span> 武林，宝刀屠龙，号令天下，谁敢不从！</span> <div>倚天不出，谁与争锋；</div> </span> <br> <input type="button" value="点击text" onclick="textGetClick()"> <input type="button" value="设置text" onclick="textSetClick()"> </div></body></html><script> var spanArr = document.getElementsByTagName("span") function textGetClick(){ var inText = spanArr[0].innerText; console.log(inText); // 武林，宝刀屠龙，号令天下，谁敢不从！ // 倚天不出，谁与争锋； } function textSetClick(){ spanArr[0].innerText = "人间绝品应难识，闲对茶经忆友人<br>一杯永日醒双眼，草木英华信有神"; //人间绝品应难识，闲对茶经忆友人<br>一杯永日醒双眼，草木英华信有神 }</script>- textContent
textContent 属性设置或返回指定节点的文本内容，以及它的所有后代。
如果您设置了 textContent 属性，会删除所有子节点，并被替换为包含指定字符串的一个单独的文本节点。
提示：有时，此属性可用于取代 nodeValue 属性，但是请记住此属性同时会返回所有子节点的文本。
<body> <div> <span> <span> 武林，宝刀屠龙，号令天下，谁敢不从！</span> <div>倚天不出，谁与争锋；</div> </span> <br> <input type="button" value="点击content" onclick="contentGetClick()"> <input type="button" value="设置content" onclick="contentSetClick()"> </div></body></html><script> var spanArr = document.getElementsByTagName("span") function contentGetClick(){ var inText = spanArr[0].textContent; console.log(inText); // 武林，宝刀屠龙，号令天下，谁敢不从！ // 倚天不出，谁与争锋； } function contentSetClick(){ spanArr[0].textContent = "人间绝品应难识，闲对茶经忆友人<br>一杯永日醒双眼，草木英华信有神"; // 人间绝品应难识，闲对茶经忆友人<br>一杯永日醒双眼，草木英华信有神 }</script>区别整理
- innerText与textContent效果相同，可以设置文本的,标签内容,是没有标签的效果的；
- innerHTML可以设置标签内容，且标签保护效果；
- innerText与textContent效果相同，可以获取标签内容,且可以获取标签内容中的标签；
- innerHTML才是真正的获取标签中间的所有内容
innerText/textContent的用法总结：
- innerText可以获取标签间的内容，如果标签间只有文本的话，则是直接获取，如果标签间还有嵌套标签的话，则会将嵌套标签忽略掉
- 在给标签设置内容的时候，如果是纯文本内容的话，则直接设置，如果设置的内容里面，有标签的话，则会将标签进行转义
- innerText是低版本的火狐浏览器不支持,高版本的火狐浏览器，两个属性都支持，而IE8及之前的浏览器只支持 innerText不支持textContent
innerHTML用法的总结：
- 使用innerHTML来获取标签间内容的时候，如果标签间是纯文本内容的话，则是直接获取，如果标签间间有嵌套标签的话，则会将标签一并获取
- 给标签设置内容的时候，如果设置的内容是纯文本的话，则是直接设置，如果设置的内容里面，有嵌套标签的话，则会将标签在浏览器中渲染出来
- 没有兼容性的问题 各浏览器都支持
设置，获取，删除属性
- setAttribute()
setAttribute() 方法添加指定的属性，并为其赋指定的值。
如果这个指定的属性已存在，则仅设置/更改值。
- getAttribute()
getAttribute() 方法返回指定属性名的属性值。
- removeAttribute()
removeAttribute() 方法删除指定的属性。
<body> <div> <input value="3652"> <input type="button" onClick="setClick()" value="点击设置"> <input type="button" onClick="getClick()" value="点击查询"> <input type="button" onClick="deleteClick()" value="点击删除"> </div></body></html><script> var input = document.getElementsByTagName("input")[0]; // setAttribute 设置input的type为file function setClick(){ input.setAttribute("type","file") } // getAttribute 输出input的type function getClick(){ console.log(input.getAttribute("type")); } //removeAttribute 删除input的value值 function deleteClick(){ input.removeAttribute("value") }</script>文件上传
- 利用 input 标签设置 type="file" 打开本地的资源管理器；
- input 标签的 accept 属性可以设置上传什么类型的文件；accept 属性并不会验证选中文件的类型. 他只是为开发这提供了一种引导用户做出期望行为的方式而已, 用户还是有办法绕过浏览器的限制.
- input file 标签一般对应着一个上传文件；
- input 标签的 multiple 属性设置该字段可接受多个上传文件；
- input 选择完文件后标签的 target.files 中存在当前选中的文件内容（信息），此时也可以进行判断上传文件类型及上传文件大小等；
批量上传：每个按钮只选择一个文件渲染到上传列表再进行批量上传
单选文件
1. 创建input file按钮，弹窗选择文件；
2. 选择文件后拿到文件名追加到上传文件列表；
3. 在创建一个新的 input file按钮，隐藏之前的已存储文件的按钮；
4. 把隐藏的input数据放入内存要上传的数据列表list中
批量上传
1. new 一个formData
2. 构建文件表数组，放入fornData 的 batchUploadEdocReq 中
3. 通过上传列表找到所有上传信息
4. 遍历 input file ,把他们的file[0]放入formData 的fileList中
5. 发送 ajax 请求，把 formData 放入到 data 中
6. 注意设置： contartType = false; processData = false;
```
this.accompanyingDecumAjaxObj = {
decId : this.id,
edocList : this.List
}
var formData = new FormData();
formData.append('batchUploadEdocReq',JSON.stringify(this.accompanyingDecumAjaxObj))
for(let i=0; i< this.imputFileListInfo.length; i++){
formData.append('fileList',this.imputFileListInfo[i][0]);
}
var _this = this;
var ajaxUrl = "URL";
$.ajax({
type : "POST",
url : ajaxUrl,
data : formData,
cache : false,
timeout: 120000,
contentType : false,
processData : false,
success : function(data) {
},
error : function(data) {
}
});
}
```
encodeURI与encodeURIComponent与escape转义
encodeURI与decodeURI
encodeURI("中国") = "%E4%B8%AD%E5%9B%BD"
decodeURI("%E4%B8%AD%E5%9B%BD") = "中国"
encodeURIComponent与decodeURIComponent
encodeURIComponent("中国") = "%E4%B8%AD%E5%9B%BD"
decodeURIComponent("%E4%B8%AD%E5%9B%BD") = "中国"
escape与unescape
escape("中国") = "%u4E2D%u56FD"
unescape("%u4E2D%u56FD") = "中国"
