JS深入(异步嵌异步)

1.事件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        #div{
            width:200px;
            height:200px;
            background:yellow;
            position:absolute;
        }
    </style>
</head>
<body>
    <div id="div"></div>
    <script>
        var oDiv=document.getElementById("div")
        oDiv.onmousedown=function(ev){
            var disX=ev.clientX-oDiv.offsetLeft
            var disY=ev.clientY-oDiv.offsetTop

            //注意onmousemove在onmousedown发生之后才有可能发生;onmouseup同理
            oDiv.onmousemove=function(ev){
                oDiv.style.left=ev.clientX-disX+'px'
                oDiv.style.top=ev.clientY-disY+'px'

            oDiv.onmouseup=function(){
                oDiv.onmouseup=null
                oDiv.onmousemove=null
            }
            }
        }
</script>
</body>
</html>

2.ajax请求

var oAjax=new XMLHttpRequest()
        oAjax.open('GET','a.txt?t='+new Date().getTime(),true)
        oAjax.send()
        oAjax.onreadystatechange=function(){
            if(oAjax.readyState==4){ 
                if (oAjax.status == 200) {
                    alert(oAjax.responseText)

                    var oBjax=new XMLHttpRequest()
                    oBjax.open('GET','b.txt?t='+new Date().getTime(),true)
                    oBjax.send()
                    oBjax.onreadystatechange=function(){
                        if(oBjax.readyState==4){ 
                            if (oBjax.status == 200) {
                                alert(oBjax.responseText)

                            }  
                            else{
                                alert('读取b.txt失败')
                            }
                        }
                    }
                }
            else{
                alert('读取a.txt失败')
            }
        }
        }

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容