Я использую JavScript и jQuery для чтения XML-документа и последующего использования информации из XML для создания объектов HTML.
Все основные узлы "C" в документе XML имеют атрибут type, и в зависимости от типа я хочу запустить функцию, которая создаст новый html-объект, используя другие атрибуты, назначенные этому конкретному узлу "C". .
В настоящее время у меня есть цикл for, который извлекает каждый узел 'C' из XML, а также его атрибуты (например, ширина, высота, x, y).
Также внутри цикла for у меня есть оператор if, который проверяет атрибут 'type' текущего обрабатываемого узла 'C' и в зависимости от типа запускает другую функцию, которая затем создает новый объект HTML с атрибутами, которые были извлечены из XML.
Проблема в том, что может быть более одного узла 'C' одного и того же типа, например, когда я создаю функцию, которая будет запускаться при обнаружении узла 'C' типа '= 1', Я не могу использовать 'var p = document.createElement('p')', потому что, если узел «C» того же типа появится позже в цикле, он будет конфликтовать и переопределять этот элемент с только что созданной переменной.
Я не совсем уверен, как подойти к этому?
Вот весь мой сценарий. Если вы хотите, чтобы я уточнил какие-либо детали, пожалуйста, спросите, я уверен, что это написано не самым лучшим образом:
var arrayIds = new Array();
$(document).ready(function(){
$.ajax({
type: "GET",
url: "question.xml",
dataType: "xml",
success: function(xml)
{
$(xml).find("C").each(function(){
arrayIds.push($(this).attr('ID'));
});
var svgTag = document.createElement('SVG');
// Create question type objects
function ctyp3(x,y,width,height,baC)
{
alert('test');
var r = document.createElement('rect');
r.x = x;
r.y = y;
r.width = width;
r.height = height;
r.fillcolor = baC;
svgTag.appendChild(r);
}
// Extract question data from XML
var questions = [];
for (j=0; j<arrayIds.length; j++)
{
$(xml).find("C[ID='" + arrayIds[j] + "']").each(function(){
// pass values
questions[j] = {
typ: $(this).attr('typ'),
width: $(this).find("I").attr('wid'),
height: $(this).find("I").attr('hei'),
x: $(this).find("I").attr('x'),
y: $(this).find("I").attr('x'),
baC: $(this).find("I").attr('baC'),
boC: $(this).find("I").attr('boC'),
boW: $(this).find("I").attr('boW')
}
alert($(this).attr('typ'));
if ($(this).attr('typ') == '3')
{
ctyp3(x,y,width,height,baC);
// alert('pass');
} else {
// Add here
// alert('fail');
}
});
}
}
});
});