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

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

Форум программистов > JavaScript: Общие вопросы > Создать тег object программно

Автор: Се ля ви 1.6.2011, 09:47

Приветствую, народ!

Вот код:

Код

var /** @type {HTMLObjectElement} */ obj = document.createElement('object');
obj.data = '/src-xml/canvas.svg';//setAttribute('data', '/src-xml/canvas.svg');
obj.type = 'image/svg+xml';//setAttribute('type', 'image/svg+xml');
obj.width = '502';//obj.setAttribute('width', '502');
obj.height = '502';//obj.setAttribute('height', '502');
alert(obj);
document.appendChild(obj);

Он - не работает ни в последнем Google Chrome, ни в FF4 (закомменченные варианты с setAttribute не работают так же). На последней строчке вылетает какой-то DOMException-3. При том, что в HTML-документ вставка

Код

<object
        data="/src-xml/canvas.svg"
        type="image/svg+xml"
        width="502"
        height="502">Чё-та ни то!!! :(((</object>

Работает нормально - по крайней мере в этих браузерах.

Не подскажете, в чём может быть дело? Очень нужно вставлять именно программно, поскольку IE до 9-ки не поддерживает SVG нормально (без плагина) и нужно будет по-этому распознавать - в каком мы браузере и вставлять либо SVG, либо VML - соответственно, нужно будет делать это программно...

Автор: Amphiluke 1.6.2011, 12:35

Стесняюсь спросить… smile

Цитата(Се ля ви @ 1.6.2011, 13:47

)

document.appendChild(obj);

почему так, а не так, скажем:

Код


document.body.appendChild(obj);

Автор: Котокобра 1.6.2011, 12:42

Amphiluke,
+1

Автор: Се ля ви 1.6.2011, 15:16

Мда, ступил. Спасибо, народ! smile

))

P.S. Я этот вариант в числе прочих тоже пробовал, но там другая ошибка была и я подумал, что тоже лажа... Короче, всё пучком, разобрался.

Автор: Се ля ви 3.6.2011, 17:56

А ошибка, о которой я говорил выше, между тем, не исчезла. Мне удалось её обойти в моём конкретном случае, но вообще было бы неправильным о ней не написать. Я, честно говоря, даже не знаю, возможно ли в принципе её разрешить?..

Дело в том, что я создаю тег object для вставки SVG-файла. И не просто вставки SVG-файла, а ещё и для рисования на нём средствами JavaScript.

Для рисования мне нужно обращаться к элементу типа SVGSVGElement, который находится в свойстве contentDocument созданного таким образом и вставленного объекта:

Код

var /** @type {SVGSVGElement} */
    svgCanvas = obj.contentDocument.childNodes[1];

Именно в него потом можно appendChild`ить новые созданные SVG-элементы.

Так вот, если вызвать этот код сразу после создания объекта таким вот макаром, то он выдаёт ошибку. А если не сразу, а с небольшой задержкой - то всё норм. По-видимому, подгрузка документа в вновь созданный тег object происходит не сразу, а через некоторое время, а браузер, не дожидаясь этого, сразу же выполняет следующие за инструкцией добавления object`а скрипты параллельно с этим процессом.

Глюк воспроизводится в FF4 и Chrome11. В остальных браузерах пока не проверял, но думаю, что это - глюк общий...