2012-01-13 2 views
0

Я хотел бы добавить XML на мою HTML-страницу. Я бы хотел, чтобы Тема отображалась как «h3», содержимое отображалось как «p» и url для отображения внутри «a href».Как я могу добавить XML на HTML-страницу с гиперссылкой

XML

<linkedin> 
<discussion> 
    <topic>This is the discussion name</topic> 
    <content>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce ligula mi, convallis eget iaculis id, euismod non arcu. Morbi porta.</content> 
    <url>http://www.linkedin.com/groups/</url> 
</discussion> 

Вот как я хотел бы, выводимый HTML посмотреть:

<h3>This is the discussion name</h3> 
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce ligula mi, convallis eget iaculis id, euismod non arcu. Morbi porta.</p> 
<a href="http://www.linkedin.com/groups/"></a> 

Большое спасибо, я надеюсь, что это объяснение того, что я застрял на имеет смысл.

+1

Нет, это не имеет смысла , Что именно вы «застряли»? Как вы пытаетесь добавить XML? – Pointy

+0

Хотите преобразовать XML в HTML? – Jonathan

+0

Мне просто нравятся , и из XML-файла для отображения на любой HTML-странице. Мне просто нужно знать, что HTML будет извлекать эту информацию из XML-файла? – Tim

ответ

0

ПРИМЕЧАНИЕ: Это так же просто, как и получается. Он не обрабатывает случаи, когда какой-либо из дочерних узлов отсутствует.

Просто, чтобы вы начали использовать запрос ajax.

HTML

<!DOCTYPE> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 
    <script type = "text/javascript" src = "script.js" defer = "defer"></script> 
</head> 
<body> 

</body> 
</html> 

JS (script.js)

function getXML() { 
    var xmlhttp,xmlDoc; 
    if (window.XMLHttpRequest) { 
     xmlhttp = new XMLHttpRequest(); 
    } 
    else {// code for IE6, IE5 
     xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    xmlhttp.open("GET", "your-xml-file.xml", false); 
    xmlhttp.send(); 
    xmlDoc = xmlhttp.responseXML; 
    showDiscussions(xmlDoc); 
} 

function showDiscussions(xmlDoc) { 
    var discHolder = document.createElement("DIV"), 
     disc = xmlDoc.getElementsByTagName("discussion"); 
    for (var i = 0, j = disc.length; i < j; i++) { 
     var topic = document.createElement("h3"), 
      content = document.createElement("p"), 
      url = document.createElement("a"); 

     topic.innerHTML = disc[i].getElementsByTagName("topic")[0].childNodes[0].nodeValue; 
     discHolder.appendChild(topic); 
     content.innerHTML = disc[i].getElementsByTagName("content")[0].childNodes[0].nodeValue; 
     discHolder.appendChild(content); 
     url.href = disc[i].getElementsByTagName("url")[0].childNodes[0].nodeValue; 
     url.innerHTML = disc[i].getElementsByTagName("url")[0].childNodes[0].nodeValue; 
     discHolder.appendChild(url); 

    } 

    document.body.appendChild(discHolder); 
} 

getXML(); 

Я также рекомендуем использовать jquery

Смежные вопросы