PHP编程实战15-6

<!--PHP编程实战-->
<!--JSON & Ajax -->
<!--15-6-->
<!--使用XMLHttpRequest抓取XML文件的内容并显示为 纯文本-->
<html>
<head>
    <style type="text/css">
        #generated_content {
            border: 1px solid black;
            widht: 300px;
            background-color: #dddddd;
        }
    </style>
</head>
<body>
<p><strong>Ajax grabbed plain text:</strong></p>

<div id="generated_content"> </div>
<script type="text/javascript">
    var xhr = new XMLHttpRequest();
    xhr.open("GET", "animals.xml", true);
    xhr.onreadystatechange = function () {
        //console.log(xhr.readyState);
        if (xhr.readyState == 4) {
            var message = "";
            //console.log(xhr.status);
            if (xhr.status = 200) {
                // 将结果作为纯文本返回
                console.log(xhr.responseText);
                message = "<pre>" + xhr.responseText + "</pre>";
            }
            else {
                message = "An error has occured making the request";
            }
            //xml文件内容并没有原样显示,而是剔除了标签
            document.getElementById("generated_content").innerHTML = message;
        }
    }
    xhr.send(null);
</script>
</body>
</html>

GetElementById

Element单数,结果唯一

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

推荐阅读更多精彩内容

  • 前一篇说了DOM树,主要是了解js和html以及css之间对应的关系,可以通过这样一个结构把两者联系起来。 既然可...
    Blackdooog阅读 171评论 0 0
  • 原文 链接 关注公众号获取更多资讯 一、基本类型介绍 1.1 Node类型 DOM1级定义了一个Node接口,该接...
    前端进阶之旅阅读 3,962评论 7 34
  • 前言 归根结底,代码都是思想和概念的体现。没人能把一种程序设计语言的所有语法和关键字都记住,可以查阅参考书来解决。...
    朱细细阅读 2,968评论 4 14
  • 第一次听到老人与海的故事可能是小时候的一道语文阅读题,太久了,已经记不得了。印象中,就是一个倔强的老头历尽艰辛出海...
    夕阳之余晖阅读 1,789评论 0 5
  • 清澈的小溪,游鱼背上了标枪 蔚蓝的天空,飞鸟学会了织网 臭水沟里的老鼠嗅到了希望 黑暗在黑暗中放光 魔鬼高坐在统治...
    玩笑的熊阅读 325评论 80 29