Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > JavaScript: Общие вопросы > XML элементы не вставляются в XHTML дерево

Автор: AndyMur 15.8.2008, 13:26

Добрый день...

следующая проблема возникла, после подгрузки xml документа требуется часть содержимого вставить в DOM дерево страницы

такой код не решает проблемы, потому как узел хоть и вставляется является невидимым

Код


function()
                        {
                            try //Internet Explorer
                            {
                                xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
                                xmlDoc.async="false";
                                xmlDoc.loadXML("<?xml version='1.0' encoding='utf-8' ?><elements><input type='button' caption='bbb' /></elements>");
                            }
                            catch(e)
                            {
                                try //Firefox, Mozilla, Opera, etc.
                                {
                                    parser=new DOMParser();
                                    xmlDoc=parser.parseFromString("<?xml version='1.0' encoding='utf-8'?><elements><input type='button' caption='bbb'/></elements>", "text/xml");
                                }
                                catch(e) 
                                {
                                    alert('error while parsing ' + e.message);
                                }
                            }
                            var input = xmlDoc.documentElement.getElementsByTagName('input')[0];
document.getElementById('div').appendChild(input);

Проблема в том что document.createElement('input') - является Object InputHtmlElement, а input выдранный из дерева Object Element'ом...
Не подскажите как решить проблему? Каким-то образом привести XML NODE Object к Html Object, чтобы он воспринимался браузером.

Автор: AndyMur 15.8.2008, 17:46

upd.

Вопрос был решен, но не до конца :(

xml был приведен к xhtml, что позволило следующему коду начать работать в FX 2.0 и Opera 9.20

В IE происходит исключение в строке appendChild : Интерфейс не поддерживается.

Есть мнение что IE так и не сумел признать элемент родным HTMLElement'ом.

Если есть идеи, прошу делиться smile

Код привожу:

Код


function()
{
    try //Internet Explorer
    {
        xmlDoc=new ActiveXObject('MSXML.DomDocument');
        xmlDoc.async="false";
        xmlDoc.loadXML("<?xml version='1.0' encoding='utf-8' ?><html xmlns='http://www.w3.org/1999/xhtml' version='-//W3C//DTD XHTML 1.2//EN' xml:lang='en'><head></head><body><input type='button' caption='bbb' /></body></html>");
    }
    catch(e)
    {
        try //Firefox, Mozilla, Opera, etc.
        {
            parser=new DOMParser();
            xmlDoc=parser.parseFromString("<?xml version='1.0' encoding='utf-8' ?><html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en'><head></head><body><input type='button' caption='bbb' /></html></body></html>", "text/xml");
        }
        catch(e) 
        {
            alert('error while parsing ' + e.message);
        }
    }
    var input = xmlDoc.documentElement.childNodes[0];
    document.getElementById('div').appendChild(input);
}

Автор: АндрейМиндубаев 15.8.2008, 20:57

AndyMur, по идее нужно было бы использовать document.importNode, но в IE7 такой функции нет.

Но вот так вроде бы работает в IE7 так, как ожидается:

Код


    var input = xmlDoc.getElementsByTagName("input")[0];
    var a = document.createDocumentFragment();
    a.appendChild(document.createElement("div"));
    a.childNodes[0].outerHTML = input.xml;
    document.getElementById('div').appendChild(a);

    alert(document.getElementById('div').innerHTML); // <input type=button xmlns="http://www.w3.org/1999/xhtml" caption="bbb" />

(ну там всякие проверки надо поставить... всё такое)

Автор: AndyMur 15.8.2008, 21:58

xmlns="http://www.w3.org/1999/xhtml"

Обязательно вставлять в каждый элемент?

Спасибо про importNode, быстро глянул в документацию - вроде бы IE5+ должен держать, проверю.

И на седьмом IE проверить не успел, на шестом валилось smile

Автор: АндрейМиндубаев 15.8.2008, 22:03

> xmlns="http://www.w3.org/1999/xhtml"
> Обязательно вставлять в каждый элемент?
AndyMur, не - оно само так получилось. Почему - не знаю =)

А importNode - это только в теории "надо было бы". IE её не поддерживает.

Автор: AndyMur 15.8.2008, 22:08

Да, он сам, я уже вижу =)

Короче

var input = xmlDoc.documentElement.getElementsByTagName('input')[0];
document.getElementById('div').innerHTML = input.xml;

заработало, с учетом того что <div id='div'></div> был на странице, все счастливы

(отмечу, что в FX и Opera все по-человечески) Я просто не знал о нестандартном
свойстве xml (в FX его нет).

Только интересно как без innerHTML =) Придется в IE писать код отличный от стандартного, без appendChild и с innerHTML =\

Автор: diadiavova 18.8.2008, 22:28

Без innerHTML будет примерно так:

Код


function addButton()
{
    try //Internet Explorer
    {
        xmlDoc=new ActiveXObject('MSXML.DomDocument');
        xmlDoc.async="false";
        xmlDoc.loadXML("<?xml version='1.0' encoding='utf-8' ?><html xmlns='http://www.w3.org/1999/xhtml' version='-//W3C//DTD XHTML 1.2//EN' xml:lang='en'><head></head><body><input type='button' value='knopka' caption='bbb' /></body></html>");
    }
    catch(e)
    {
        try //Firefox, Mozilla, Opera, etc.
        {
            parser=new DOMParser();
            xmlDoc=parser.parseFromString("<?xml version='1.0' encoding='utf-8' ?><html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en'><head></head><body><input type='button' caption='bbb' /></html></body></html>", "text/xml");
        }
        catch(e) 
        {
            alert('error while parsing ' + e.message);
        }
    }
    var input = xmlDoc.getElementsByTagName("input")[0];
    var htmlInput=document.createElement(input.tagName);
    for (var i=0;i<input.attributes.length;i++)
    {
        htmlInput.setAttribute(input.attributes(i).name,input.attributes(i).value)
    }
    document.getElementById('div').appendChild(htmlInput);
    
}

здесь я скопировал код из второго сообщения, кое-что изменил(например я не встречал такого атрибута caption - соответственно заменил его на value), но в принципе логика понятна, в IE работает.