javaScript常见问题总结

1.本地缓存

将对象转换成json
JSON.stringify(response.data.data);
存储对象
localStorage.setItem("pro_list",a);
获取对象的全部内容（对象格式）
var b = JSON.parse(localStorage.getItem("pro_list"));
获取对象的内容（数组格式）
var b = localStorage.getItem("pro_list");
清除缓存
localStorage.removeItem('userinfo');
复制代码

2.axios.ajax

//有参数
axios.post(API_URL2)
//无参数
axios.post(API_URL2,{
	type:a,
	page:page,
	num:num
})
.then(function (response) {
	成功了显示
})
.catch(function (error) {
	不成功显示
	console.log(error);
});
复制代码

3.事件句柄

事件句柄是指事件发生时要进行的操做。 每个事件均对应一个事件句柄，在程序执行时，将相应的函数或语句指定给事件句柄，则在该事件发生时，浏览器便执行指定的函数或语句，从而实现网页内容与用户操做的交互。当浏览器检测到某事件发生时，便查找该事件对应的事件句柄有没有被赋值，若是有，则执行该事件句柄。 www.runoob.com/jsref/met-e…

4.js设置元素属性

设置属性：
		目标元素.setAttribute（‘属性’，值）
获取属性：
		目标元素.getAttribute（“属性”）
复制代码

5.js设置更换url地址

window.location.href=url;  //物理返回会有地址痕迹
window.location.repeat(url)；//物理返回无地址痕迹
复制代码

6.将字符串的某些元素替换成另外一个

目标元素.replace(/原字符串/g,'新的字符串'); 
复制代码

7.获取url后面的参数

window.location.href="pro_details.html?rel="+rel;
/***********获取url后面的参数开始***********/
var url = location.search; 
var theRequest = new Object();
if ( url.indexOf( "?" ) != -1 ) {
  var str = url.substr( 1 ); //substr()方法返回从参数值开始到结束的字符串；
  var strs = str.split( "&" );
  for ( var i = 0; i < strs.length; i++ ) {
    theRequest[ strs[ i ].split( "=" )[ 0 ] ] = ( strs[ i ].split( "=" )[ 1 ] );
  }
}
console.log(theRequest.rel); //此时的theRequest就是咱们须要的参数；
/***********获取url后面的参数结束***********/
复制代码

8.保留2位小数，2后面补上00.即2.00

function toDecimal2(x) { 
    var f = parseFloat(x); 
    if (isNaN(f)) { 
		return false; 
    } 
    var f = Math.round(x*100)/100; 
    var s = f.toString(); 
    var rs = s.indexOf('.'); 
    if (rs < 0) { 
        rs = s.length; 
        s += '.'; 
    } 
    while (s.length <= rs + 2) { 
    	s += '0'; 
    } 
    return s; 
}
复制代码

9.原生js在原生的内部的后面添加元素

var parent = document.getElementsByClassName("目标元素")[0];
var div = document.createElement("div");
div.setAttribute("class", "mui-indicator");
parent.appendChild(div);

复制代码

10.时间戳转换成时间

function getLocalTime(nS) {
   return new Date(parseInt(nS) * 1000).toLocaleString().replace(/:\d{1,2}$/,' ');     
}

复制代码

11.原生js操做类名添加删除类名，获取元素

为 <div> 元素添加 class:
document.getElementById("myDIV").classList.add("mystyle");
为 <div> 元素添加多个类:
document.getElementById("myDIV").classList.add("mystyle", "anotherClass", "thirdClass");
为 <div> 元素移除一个类:
document.getElementById("myDIV").classList.remove("mystyle");
为 <div> 元素移除多个类:
document.getElementById("myDIV").classList.remove("mystyle", "anotherClass", "thirdClass");
检查是否含有某个CSS类
myDiv.classList.contains('myCssClass'); //return true or false
window.getComputedStyle(目标元素).width
#得到点击元素的前一个元素
e.currentTarget.previousElementSibling.innerHTML
 #得到点击元素的第一个子元素
 e.currentTarget.firstElementChild
#得到点击元素的下一个元素
 e.currentTarget.nextElementSibling
#得到点击元素中id为string的元素
 e.currentTarget.getElementById("string")
#得到点击元素的string属性
e.currentTarget.getAttributeNode('string')
#得到点击元素的父级元素
e.currentTarget.parentElement
#得到点击元素的前一个元素的第一个子元素的HTML值
e.currentTarget.previousElementSibling.firstElementChild.innerHTML

复制代码

12.获取元素的高度

//document.documentElement.offsetHeight 文档高度
//document.documentElement.scrollTop 元素离顶部高度
//document.documentElement.clientHeight 展现区域高度

复制代码

13.js数组对象 与 js 字符串 互换

Js字符串 = JSON.stringify(数组对象);
数组对象 = JSON.parse(js字符串);

复制代码

14.删除数组某一个元素

数组名.splice(下标,1);

复制代码

15.input上传图片 文本图标

<label>
	<input 
		style="position:absolute;opacity:0;" 
		type="file"
		name="file"
	  	id="Album_img" 
		accept="image/gif,image/jpeg,image/x-png" 
		capture="camera" />
	<img style="width: 60px;height: 60px;" src="/public/images/add-button.jpg"> 
 </label> 

复制代码

16.input图片上传获取 64 Hb

var input = document.getElementById("file_input");
var input = document.getElementById("file_input");
var result,div;
if(typeof FileReader==='undefined'){
	   result.innerHTML = "抱歉，你的浏览器不支持 FileReader";
	   input.setAttribute('disabled','disabled');
}else{
	   input.addEventListener('change',readFile,false);
}
function readFile(){
    if(!input['value'].match(/.jpg|.gif|.png|.bmp/i)){ 
		//判断上传文件格式
      	return alert("上传的图片格式不正确，请从新选择")         
  	 }
  	 var reader = new FileReader();
   	 reader.readAsDataURL(this.files[0]);
  	 reader.onload = function(e){
        console.log(reader.result);
	 }
}

复制代码

17.图片显示不出来 显示的图片

onerror="this.src='images/bai.jpg'"

复制代码

18.原生js删除本身

//获取须要删除的元素
var delli = even.currentTarget.parentElement.parentElement.parentElement;
//找到父元素删除本身
delli.parentNode.removeChild(delli);

复制代码

19.判断设备是ios仍是安卓

var u = navigator.userAgent;
var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
 var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
isAndroid为 true，则为安卓客户端； isIOS为true，则为ios客户端

复制代码

20.微信小程序监听scroll-view滑动到顶部、底部、左边、右边

微信小程序中常常须要监听scroll-view的滑动边界以作相应的业务操做。

当滚动到顶部时会触发bindscrolltoupper事件(具体可留意GIF输出)

当滚动到底部时会触发bindscrolltolower事件(具体可留意GIF输出)

当滚动到最左边时会触发bindscrolltoupper事件(具体可留意GIF输出)

当滚动到最右边时会触发bindscrolltolower事件(具体可留意GIF输出)