JS常见问题总结二

console.log(100)setTimeout(function(){ ????console.log(200)})console.log(300)

console.log(1)setTimeout(function(){ ???console.log(2)},0)console.log(3)setTimeout(function(){ ???console.log(4)},1000)console.log(5)

打印顺序：1，3，5，2，一秒钟之后打印4

var arr = [‘a‘,‘b‘,‘c‘,‘d‘]arr.forEach(function(item,index){ ???console.log(index,item)})var arr = [1.2.3.4]var result = arr.every(function(item,index){ ???if (item<5) { ???????return true ???}})console.log(result)var arr = [1.2.3.4]var result = arr.some(function(item,index){ ???if (item<3) { ???????return true ???}})console.log(result)var arr = [1.2.3.4]var arr2 = arr.sort(function(a,b){ ???//从小到大排序 ???return a-b ???//从大到小排序 ???return b-a})console.log(arr2)var arr = [1,2,3,4]var arr2 = arr.map(function(item,index){ ???return ‘<b>‘+item+‘<b>‘})console.log(arr2)

var arr = [1,2,3,4]
var arr2 = arr.filter(function(item,index){
if (item<3) {
return true
}
})
console.log(arr2)

function formatDate(dt){ ???if (!dt) { ???????dt = new Date() ???} ???var year = dt.getFullYear() ???var month = dt.getMonth()+1 ???var date = dt.getDate() ???if (month < 10) { ???????//强制类型转换 ???????month = ‘0‘+month ???} ???if (date < 10) { ???????date= ‘0‘+date ???} ???return year + ‘-‘+month + ‘-‘+date}var dt = new Date()var formatDate = formatDate(dt)console.log(formatDate)

var random = Math.random()var random = random + ‘0000000000‘//后面加上10个0var random = random.slice(0,10)console.log(random)

function forEach(obj,fn){ ???var key ???if (obj instanceof Array) { ???????obj.forEach(function(item,index){ ???????????fn(index,item) ???????}) ???}else { ???????//不是数组就是对象 ???????for(key in obj){ ???????????fn(key,obj[key]) ???????} ???}}var arr = [1,2,3]//参数顺序换了，为了和对象的遍历格式一致forEach(arr,function(item,index){ ???console.log(index,item)})var obj = {x:100 , y:200}forEach(obj,function(key,value){ ???console.log(key,value)})

var div1=document.getElementById(‘div1‘)//添加新节点var p1 - document.createElement(‘p‘)p1.innerHTML=‘this is p1‘//添加新创建的元素div1.appendChild(p1)//移动已有节点var p2 = document.getElementById(‘p2‘)div1.appendChild(p2)//获取父元素和子元素var div1 = document.getElementById(‘div1‘)var parent = div1.parentElementvar child = div1.childNodesdiv1.removeChild(child[0])//获取DOM节点var div1= document.getElementById(‘div1‘)//元素var divList = document.getElementsByTagName(‘div‘)//集合console.log(divList.length)console.log(divList[0])var containerList = document.getElementByClassName(‘.container‘)var pList = document.querySelectorAll(‘p‘) 

//propertyvar div1 = document.getElementById(‘div1‘)console.log(div1.className)div1.className=‘abc‘console.log(div1.className)//attrvar p1 = document.getElementById(‘p1‘)console.log(p1.getAttribute(‘data-name‘))p1.setAttribute(‘data-name‘,‘xyz‘)

//检测浏览器类型，以chrome为例//navigatorvar ua=navigator.userAgentvar isChrome = ua.indexOf(‘Chrome‘)console.log(isChrome)

//screenconsole.log(screen.width)console.log(screen.height)//locationconsole.log(location.href)console.log(location.protocol)console.log(location.host)console.log(location.ashpathname)console.log(location.search)console.log(location.h)//historyhistory.back()history.forward()

var rhr = new XMLHttpRequest()xhr.open("GET","/api",false)xhr.onreadystatechange = function(){ ???if (xhr.readyState == 4) { ???????if (xhr.state === 200) { ???????????alert(xhr.responseText) ???????} ???}}xhr.send(null)

function bindEvent(elem,type,selector,fn){ ???if (fn==null) { ???????fn=selector ???????selector=null ???} ???elem.addEventListener(type,function(e){ ???????var target ???????if (selector) { ???????????target = e.target ???????????if (target.matches(selector)) { ???????????????fn.call(target,e) ???????????} ???????}else{ ???????????fn(e) ???????} ???})}//使用代理var div1 = document.getElementById(‘div1‘)bindEvent(div1,‘click‘,‘a‘,function(e){ ???console.log(this.innerHTML)})//不使用代理var a = document.getElementById(‘div1‘)bindEvent(div1,‘click‘,function(e){ ???console.log(a.innerHTML)})

window.addEventListener(‘load‘,function(){ ???//页面得全部加载完成才会执行，包括图片、视频等})document.addEventListener(‘DOMContentLoaded‘,function(){ ???//DOM渲染完即可执行，此时图片、视频可能还没加载完})