Ajax拿取html格式数据

最新推荐文章于 2021-08-06 15:45:38 发布

刘小筛

最新推荐文章于 2021-08-06 15:45:38 发布

阅读量1.2k

点赞数

分类专栏：前端 Ajax HTML Javascript 文章标签： ajax xmlhttprequest html xml

本文链接：https://blog.csdn.net/LHJBK/article/details/53130538

版权

Javascript 同时被 3 个专栏收录

19 篇文章 0 订阅

订阅专栏

前端

17 篇文章 0 订阅

订阅专栏

Ajax

7 篇文章 0 订阅

订阅专栏

数据格式提要

在服务器端Ajax是一门与语言无关的技术。在业务逻辑层使用何种服务器端语言都可以
从服务器端接收数据的时候，那些数据必须以浏览器能够理解的格式来发送。服务器端端编程语言能以如下3种格式返回数据： XML JSON
HTML

解析 HTML

HTML由一些普通文本组成，如果服务器通过XMLHttpRequest发送HTML，文本将存储在responseText属性中。
不必从responseText属性中读取数据。它已经是希望的格式，可以直接将它插入到页面中。
插入HTML代码最简单的方法是更新这个元素的innerHTML属性。

HTML小结

优点：

从服务器端发送端HTML 代码在浏览器不需要用JavaScript进行解析
HTML的可读性好
HTML代码块与innerHTML属性搭配，效率高

缺点：
若需要通过Ajax更新一篇文档的多个部分，HTML不合适
innerHTML并非 DOM标准。

代码展示如下：

1、html代码（文件名为：test1.html）：

<h2><a href="mailto:15204510180@163.com">JBK</a></h2>
<a href="http://baidu.com/">http://baidu.com/</a>

2、html解析代码：

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script>
        window.onload = function () {

            var  as= document.getElementsByTagName("a");
            for(var i=0;i< as.length;i++){
                as[i].onclick= function () {
                    var request = new XMLHttpRequest();
                    var url = this.href;
                    var method="GET";
                    request.open(method,url);
                    request.send(null);
                    request.onreadystatechange= function () {
                        if( request.readyState==4){
                            if(request.status==200||request.status==304){
                                document.getElementById("details").innerHTML=request.responseText;
                            }

                        }
                    }
                    return false;

                }
            }



        }
    </script>
</head>
<body>
<a href="test1.html">1</a>
<a href="test1.html">2</a>
<a href="test1.html">3</a>
<a href="test1.html">4</a>
<div id="details"></div>
</body>
</html>

刘小筛

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Ajax拿取html格式数据

数据格式提要在服务器端Ajax是一门与语言无关的技术。在业务逻辑层使用何种服务器端语言都可以从服务器端接收数据的时候，那些数据必须以浏览器能够理解的格式来发送。服务器端端编程语言能以如下3种格式返回数据： XML JSON HTML解析 HTMLHTML由一些普通文本组成，如果服务器通过XMLHttpRequest发送HTML，文本将存储在responseText属性中。不必从respo
复制链接

扫一扫