简体   繁体   English

从xml中“获取”数据以通过javascript输入到html(入门)

[英]'Getting' data from xml to input into html via javascript (Beginner)

--Updated Code to make it...more simple-- -更新了代码,使其更加简单-

Kind of a strange situation, according to w3schools my code should work, but for some reason it doesn't...connect. 有点奇怪的情况,根据w3schools的说法,我的代码应该可以工作,但是由于某种原因,它无法...连接。 Here's my code for my java script. 这是我的Java脚本代码。

XHTML XHTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
    <head>
    </head>
    <body>
        <p id="intro">Hello</p>
        <script type="text/javascript" id="announce" src="announce.js"></script>
    </body>
</html>

JavaScript 的JavaScript

/*jscript*/
var newannouncement = document.createElement('p');
newannouncement.id = 'announcing';
newannouncement.appendChild(document.createTextNode('Here is an announcement'));
var scr = document.getElementById('announce');
scr.parentNode.insertBefore(newannouncement, scr);      

if(window.XMLHttpRequest)
{
    xmlhttp=new XMLHttpRequest();
} else {
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}

**xmlhttp.open("GET", "catalog.xml",false);**
xmlhttp.send();
xmlDoc=xmlhttp.responseXML;

var x=xmlDoc.getElementsByTagName("cd");
for (i=0; i<x.length; i++)
{
    alert("for")
}

XML XML格式

<?xml version="1.0"?>
<catalog 
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:noNamespaceSchemaLocation="catalog.xsd">
    <cd>
    <author>Ferdi</author>
    <date>1192</date>
    </cd>
    <cd>
    <author>JRR</author>
    <date>1995</date>
     </cd>
</catalog>

Update 1 更新1

Due to the fact that I considered the previous code, too confusing, I've changed it to make it simpler so that I can actually find out what the heck is cracking off. 由于我认为之前的代码太混乱了,因此我对其进行了更改以使其更简单,从而使我可以真正弄清到底是什么。 The problem appears to be the xmlhttp.open() as the for loop doesn't run. 问题似乎是xmlhttp.open(),因为for循环未运行。 I've switched to xhtml as it keeps the code...easier to read (for me) and I understand that document.write() doesn't work. 我已经改用xhtml了,因为它保留了代码...(对我来说)更易于阅读,并且我知道document.write()不起作用。

The problem 问题

I simply just call the function in-line. 我只是简单地内联调用函数。 The * 's indicate the line that fails. *表示失败的行。 Now, I've tried just leaving it as announce.xml (leaving the announce.xml in same directory) and I've now tried moving it down a directory. 现在,我尝试将其保留为announce.xml(将announce.xml保留在同一目录中),并且现在尝试将其向下移动到目录中。 I've also tried adding /../ but to no avail. 我也尝试添加/../但无济于事。

I didn't see any 'technical' requirements on the w3schools website...so I'm assuming like html it works out of the box. 我在w3schools网站上没有看到任何“技术”要求...所以我假设它像html一样可以直接使用。

Further notes 进一步说明

If possible if you're going to suggest technology, such as AJAX, could you please describe what it is, what it does and if possible a link to a suitable place to find out more. 如果可能的话,如果您要建议使用AJAX之类的技术,请描述一下它的含义,作用以及可能的链接,以找到更多信息。 Thanks 谢谢

(This isn't really an answer, but a comment, however I have several points I'd like to make which is easier in an answer). (这实际上不是答案,而是评论,不过,我想提出几点,在回答中比较容易)。

Are you using a debugger with your browser (FireBug extention for Firefox, or the one built into Chrome or IE)? 您是否在浏览器上使用调试器(Firefox的FireBug扩展程序,或Chrome或IE内置的调试器)? Is the Console in the debugger reporting an error? 调试器中的控制台是否报告错误? Also debuggers let you track the requests the browser makes. 调试器还可以让您跟踪浏览器发出的请求。 Does it show your request? 它显示您的要求吗?

There are several points independent from your problem: 有几点与您的问题无关:

  • Be very careful with w3schools. w3schools要非常小心。 Despite its name it's unrelated to W3C and the quality is often very lacking. 尽管它的名称与W3C无关,但其质量通常很差。
  • Any special reason you aren't using an AJAX framework such as jQuery? 您没有使用诸如jQuery之类的AJAX框架的任何特殊原因? (It's great not using one, if you what to understand how AJAX works in it's basics, but a framework really simplifies everything). (如果您不了解AJAX的工作原理,那么最好不要使用它,但是框架确实可以简化一切)。
  • You are doing a synchronous request, which you never should do. 您正在执行同步请求,这是您永远都不应做的。 Synchronous requests block the browser making it unresponsive for the user. 同步请求会阻止浏览器,从而使其对用户无响应。
  • You need to be very careful with document.write . 您需要非常小心document.write It only works during page loading and because you are doing a synchronous request. 它仅在页面加载期间有效,因为您正在执行同步请求。 In other cases you can easily "overwrite" your page with it. 在其他情况下,您可以轻松地用它“覆盖”您的页面。

EDIT: 编辑:

The problem is most likely what @bazmegakapa suggested: XMLHttpRequest usually only works when on a web server. 该问题很可能是@bazmegakapa所建议的: XMLHttpRequest通常仅在Web服务器上有效。 What you need to do is install a web server locally on your development computer and use it for testing. 您需要做的是在开发计算机上本地安装Web服务器,然后将其用于测试。 This is usually quite simple. 这通常很简单。 Even Apache is quickly installed and runs with little configuration. 即使是Apache,也可以快速安装并以很少的配置运行。 Or a package with Apache and including a DB server (MySQL) and PHP called "AMP" which are often specifically made for local web page development and testing and are setup even easier. 或带有Apache的软件包,其中包括一个数据库服务器(MySQL)和一个称为“ AMP”的 PHP,这些软件包通常专门用于本地网页开发和测试,并且安装起来更加容易。 And finally many web development IDEs have a simple web server built in (I like Aptana Studio , for example). 最后,许多Web开发IDE都内置了一个简单的Web服务器(例如,我喜欢Aptana Studio )。

What you are doing is commonly called "AJAX" which stands for "Asynchronous JavaScript and XML", except you are not doing it asynchronously, which you should not. 您所执行的操作通常称为“ AJAX” ,它表示“异步JavaScript和XML”,除了您不是异步执行(您不应该这样做)。 Have a look at a short tutorial from the Mozilla Developer Network work how to do it right: https://developer.mozilla.org/en/AJAX/Getting_Started 看一下Mozilla开发人员网络上的简短教程,了解如何正确执行: https : //developer.mozilla.org/en/AJAX/Getting_Started

If you still have problems, then you'll need to give more detailed information, most importantly the error message the browser gives in its console (see my remark on debuggers above). 如果仍然有问题,则需要提供更详细的信息,最重要的是,浏览器在其控制台中提供的错误消息(请参见上面我对调试器的评论)。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM