JavaScript: как динамически добавить файл Flash (SWF) в DOM, чтобы IE загрузил его

Question

У меня есть страницы, которые должны динамически загружать контент на основе их описания данных в файлах XML. Среди элементов, которые могут быть загружены динамически, - SWF. У меня есть код, который правильно загружает и запускает фильмы в Firefox через протоколы http и file, а Chrome - через протокол http. Мне нужно, чтобы он успешно загружался в Internet Explorer как по протоколам http, так и по протоколам файлов, но все отчеты Flash Video Player - «Фильм не загружен ...». Может ли кто-нибудь просмотреть следующую информацию и дать мне исправление?

Описание Flash-объектов в XML выглядит следующим образом:

<multimedia
    type='flash'
    swf='swf/filename_here.swf'
    width='600'
    height='400'
    version='7.0.19.0'
/>

У меня есть JavaScript, который анализирует это и создает объект, который выглядит следующим образом JSON:

{
    'tag': 'multimedia',
    'attributes': [
        'type': 'flash',
        'swf': 'swf/filename_here.swf',
        'width': '600',
        'height': '400',
        'version': '7.0.19.0'
    ]
}

В конце концов, этот объект передается в функцию, которая создает элемент DOM (да, я знаю, что функция упорядочена странным образом; я пытался разными способами заставить ее работать):

var path = var path = document.location.href;
path = path.substr(0, path.lastIndexOf('/') + 1);

var version = null;

function isIE() {
    return navigator.userAgent.lastIndexOf('Trident') > 0;
}

function buildFlash(element) {
    version = element.attributes.version;

    var name = document.createElement('param');
    name.setAttribute('name', 'movie');
    name.setAttribute('value', path + element.attributes.swf);

    (if (!isIE()) {
        var inner = document.createElement('object');
        inner.setAttribute('type', 'application/x-shockwave-flash');
        inner.setAttribute('data', path + element.attributes.swf);
        inner.setAttribute('width', element.attributes.width);
        inner.setAttribute('height', element.attributes.height);
    }

    var flash = document.createElement('object');
    flash.setAttribute('id', 'flashMovie');
    flash.setAttribute('classid', 'clsid:D27CDB6E-AE6D-11cf-96B8-444553540000');
    flash.setAttribute('width', element.attributes.width);
    flash.setAttribute('height', element.attributes.height);
    flash.appendChild(name);
    if (!isIE()) {
        flash.appendChild('inner');
    }

    var div = document.createElement('div');
    div.setAttribute('id', 'multimedia');
    div.appendChild('flash');
    return div;
 }

Полученный div в конечном итоге добавляется в правильное место на странице.

Есть идеи?

Answer 1

IE не поддерживает динамическую настройку большинства атрибутов / параметров элемента объекта.

Эту функцию можно использовать для создания кросс-браузерного элемента объекта с заданными атрибутами и параметрами.

var createSwfObject = function(src, attributes, parameters) {
  var i, html, div, obj, attr = attributes || {}, param = parameters || {};
  attr.type = 'application/x-shockwave-flash';
  if (window.ActiveXObject) {
    attr.classid = 'clsid:d27cdb6e-ae6d-11cf-96b8-444553540000';
    param.movie = src;
  }
  else {
    attr.data = src;
  }
  html = '<object';
  for (i in attr) {
    html += ' ' + i + '="' + attr[i] + '"';
  }
  html += '>';
  for (i in param) {
    html += '<param name="' + i + '" value="' + param[i] + '" />';
  }
  html += '</object>';
  div = document.createElement('div');
  div.innerHTML = html;
  obj = div.firstChild;
  div.removeChild(obj);
  return obj;
};

Пример

var swfEl = createSwfObject('http://example.com/example.swf', {id: 'myid', 'class': 'myclass', width: 100, height: 100}, {wmode: 'transparent'});
document.body.appendChild(swfEl);