JavaScript——易班优课YOOC课群在线测试答案隐藏解决方案

最新推荐文章于 2022-09-12 12:31:15 发布

Starzkg

最新推荐文章于 2022-09-12 12:31:15 发布

阅读量7.2k

点赞数 1

分类专栏： # JavaScript 文章标签： JavaScript 易班

本文链接：https://blog.csdn.net/weixin_43272781/article/details/105774421

版权

JavaScript 专栏收录该内容

117 篇文章

订阅专栏

本文介绍了一种利用AJAX技术实现页面局部刷新的方法，通过发送GET请求并使用回调函数处理响应，实现了对原页面内容的动态更新。具体步骤包括创建XMLHttpRequest对象，设置onreadystatechange事件，以及在请求完成后解析响应并更新DOM元素。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

问题描述

问题分析

解决方案

利用AJAX重新请求页面，对原页面内容替换。

var xmlhttp = new XMLHttpRequest();//获取对象
    xmlhttp.onreadystatechange = function(){//设置回调函数
        if(xmlhttp.readyState == 4){//这里的4是请求的状态码，代表请求已经完成
            if(xmlhttp.status == 200 || xmlhttp.status == 304){//这里是获得响应的状态码，200代表成功，304代表无修改可以直接从缓存中读取
                console.log(xmlhttp);
                //创建DOM
                var html=document.createElement("html");
                html.innerHTML=xmlhttp.responseText
                console.log(html)
                //获取问题信息
                var question=Array.from(html.getElementsByClassName('question-board'))
                console.log(question)
                //数据封装
                var question_arr=[]
                question.forEach(q=>{
                    document.getElementById(q.id)
                        .getElementsByClassName('the-ans')[0]
                        .innerHTML=q.getElementsByClassName('the-ans')[0].innerHTML    
                })
            }
        }
    }
    xmlhttp.open("GET",document.URL);
    xmlhttp.send();//GET请求