Существует странное поведение с DOMParser. Когда я использую «text/xml» в качестве параметра, я получаю свой объект, и каждый раз, когда я использую дочерний элемент (например, parentNodes), он сам является объектом DOM. Однако, когда я использую параметр «text/html» в качестве параметра, дети не являются объектами DOM. Почему это и как у меня есть объекты DOM для всех детей?DOMParser - дети не являются объектами DOM
Вот что я делаю:
parser = new DOMParser();
doc = parser.parseFromString(stringContainingHTMLSource, "text/html").getElementsByTagName('p');
console.log(doc[0].childNodes[0]);
Мой childNode возвращает элемент, но не как объект DOM ...
Edit: Вот мои рекурсивные функции:
var getParents = function(node, parentNodes){
if(node.nodeName == 'span'){
parentNodes.push(node.attributes[0].nodeValue);
} else if(node.nodeName == 'p' && node.attributes.length > 0) {
parentNodes.push(node.nodeName);
parentNodes.push(node.attributes[0].nodeValue);
} else {
parentNodes.push(node.nodeName);
}
if(node.parentNode.nodeName != '#document'){
getParents(node.parentNode, parentNodes);
}
return parentNodes;
};
var parse = function(node, vertical, horizontal, paragraph){
if(node.childNodes.length > 0){
for(var int = 0; int < node.childNodes.length; int++){
parse(node.childNodes[int], vertical, horizontal, paragraph);
}
} else{
var object = {};
var attributes = getParents(node, []);
for(var int = 0; int < attributes.length; int++) {
// right alignment
if(/text-align/i.test(attributes[int])){
object.alignment = attributes[int].split(": ")[1].replace(';','');
} else if (/color/i.test(attributes[int])) {
// color
object.color = attributes[int].split(":")[1];
} else if (attributes[int] == 'em') {
// italic
if (object.italics) {
delete object.bold;
object.bolditalics = true;
} else {
object.italics = true;
}
} else if (attributes[int] == 'strong') {
// bold
if (object.italics) {
delete object.italics;
object.bolditalics = true;
} else {
object.bold = true;
}
} else if (attributes[int] == 'u') {
// underline
object.decoration = 'underline';
} else if (attributes[int] == 's') {
// strike
object.decoration = 'lineThrough';
}
}
object.text = node.textContent;
pdfContent[vertical][horizontal].push(object);
}
};
for(var vertical = 0; vertical < payment.htmlContent.length; vertical++) {
for(var horizontal = 0; horizontal < payment.htmlContent[vertical].length; horizontal++) {
var parser = new DOMParser();
var paragraphs = parser.parseFromString(payment.htmlContent[vertical][horizontal], "text/xml").getElementsByTagName('p');
for (var paragraph = 0; paragraph < paragraphs.length; paragraph++) {
for (var num = 0; num < paragraphs[paragraph].childNodes.length; num++) {
parse(paragraphs[paragraph].childNodes[num], vertical, horizontal, paragraph);
}
}
}
}
что вы имеете в виду под "они не объекты DOM"? Не могли бы вы привести пример строки, которую вы передадите, и выход? На первый взгляд я бы сказал, что это потому, что childNodes возвращает узлы. Вы можете проверить только элементы, используя 'doc [0] .children [0]'. – Kaiido
@Kaiido Ну, вот что я хочу сделать ... Я рекурсивно перехожу во все дочерниеNodes (рекурсивная функция), и когда я добираюсь до моего последнего ребенка, я возвращаюсь обратно рекурсивно через свой родительский указатель (чтобы получить все имена узлов, которые имеет ребенок). С xml он работает правильно, но с html, когда я добираюсь до последнего childNode, он больше не имеет parentNodes, потому что это просто простой элемент. (обновит мой вопрос с помощью рекурсивных функций ...) – ncohen
Да, пожалуйста, обновите, для меня он работает в консоли, вручную добираясь до последнего узла и снова поднимаясь вверх. Но, возможно, вас будет интересовать [TreeWalker] (https://developer.mozilla.org/en/docs/Web/API/TreeWalker) для такого рода задач. – Kaiido