Member 13987389 Ответов: 1

Как получить дочерние элементы с помощью javascript

У меня есть такой xml файл:
Я могу получить все элементы <productcategory>, Но я хочу получить все дочерние узлы <productgroup> каждого родительского элемента <productcategory>
Я не знаю, как это сделать с помощью Javascript.
Пожалуйста, помогите мне!

<?xml version="1.0" encoding="UTF-8"?>
<productCatalog xmlns:atom="https://www.w3.org/2005/Atom" version="1.0">
<productCategory name="Software">
<productGroup name="Desktop OS">
    <propertygroupid>{...}
    <atom:link href="https://...." rel="list"/>

<productGroup name="Server OS">
     <propertygroupid>{...}
    <atom:link href="https://...."/>


<productCategory name="dfg">
<productGroup name="dfg1">
    <propertygroupid>{...}
    <atom:link href="https://...." rel="list"/>

<productGroup name="dfg2">
    <propertygroupid>{...}
    <atom:link href="https://...." rel="list"/>

<productGroup name="dfg3">
    <propertygroupid>{...}
    <atom:link href=".... " rel="list"/>


....

Что я уже пробовал:

<!DOCTYPE html>


<p id="demo"></p><br>
<p id="demo1"></p>
<pre>


var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        myFunction(this);
		myFunction1(this);
    }
};
xhttp.open("GET", "test.xml", true);
xhttp.send();

function myFunction(xml) {
    var x,x1,x2,x3, i, xmlDoc, txt,txt1,txt2;
    xmlDoc = xml.responseXML;
	
    
    x = xmlDoc.getElementsByTagName('productCategory');
	txt = x.length +"<br>";
	
    for (i = 0; i &lt; x.length; i++) { 
        txt += i.toString()+". "+      x[i].getAttribute('name') + "<br>";
		
		var xx = x[i].hasChildNodes();
				
		x1 = "...  " + x[i].childNodes.length; 
		
		
		txt1 = " - ";
		
		txt += x1.toString()+ txt1 + xx.toString() + " ... "  +"<br>";
	
    }
	
    document.getElementById("demo").innerHTML = txt; 
}

function myFunction1(xml) {
    var x, i, xmlDoc, txt;
    xmlDoc = xml.responseXML;
    txt = "<br>"+"productGroup"+"<br>"+"<br>";
	
	
    x = xmlDoc.getElementsByTagName('productGroup');
    for (i = 0; i &lt; x.length; i++) { 
        txt += x[i].getAttribute('name') + "<br>";
    }
    document.getElementById("demo1").innerHTML = txt; 
}

Er. Puneet Goel

пожалуйста, отформатируйте правильно. Используйте теги кода для написания кода. Таким образом, вы получите решение быстрее.

littleGreenDude

Пожалуйста смотрите https://www.w3schools.com/xml/xml_parser.asp

1 Ответов

Рейтинг:
2

enhzflep

Святая корова! Я думаю, что у меня есть какой-то код, спрятанный где-то в углу для обработки RSS-каналов, которые выглядят так.

Действительно аккуратная вещь о XML, полученном с помощью ajax, заключается в том, что вы можете использовать все функции выбора элементов, как и для обычного html. Так что getElementsByTagName и querySelectorAll здесь довольно полезны.

Вот некоторый код, который будет перечислять элементы productCategory и productGroup, производя следующие выходные данные:

-=== Программное обеспечение ===-
- Настольная ОС
- Серверная ОС
-=== dfg ===-
- dfg1
- dfg2
- dfg3
Используем XHR-погрузка закончена: получите "http://localhost/snippets/sep18/xmlInput.xml".

function ajaxGet(url, onLoad, onError, resType=undefined)
{
	var ajax = new XMLHttpRequest();
	ajax.onload = function(){onLoad(this);}
	ajax.onerror = function(){console.log("ajax request failed to: "+url);onError(this);}
	ajax.responseType = resType;
	ajax.open("GET",url,true);
	ajax.send();
}

window.addEventListener('load', onDocLoaded, false);

function onDocLoaded(evt)
{
	ajaxGet('xmlInput.xml', onLoaded, undefined);
	
	function onLoaded(ajax)
	{
		var XML = ajax.responseXML;
		var categories = XML.getElementsByTagName('productCategory');
		var tmp = Array.from(categories);
		tmp.forEach( 
					 function(elem)
					 {
						console.log( `-=== ${elem.getAttribute('name')} ===-` );
						var groups = Array.from( elem.getElementsByTagName('productGroup') );
						groups.forEach(
										function(grp)
										{
											console.log( `- ${grp.getAttribute('name')}` );
										}
									);
					 }
					);
	}
}