5

Diz-se que document.write não é uma boa prática, e também não funciona após window.onload, que é o caso que preciso. Eu tenho a seguinte função que preciso trocar o document.write, o detalhe é que preciso que o conteudo seja adicionado na mesma tag/elemento que está a chamada da função dento da tag , sem que o elemento pai seja sempre o mesmo.

function GerarSWF($arquivo,$largura,$altura,$id){
    document.writeln(' <object type="application/x-shockwave-flash" id="' + $id + '" data="' + $arquivo + '" width="' + $largura + '" height="' + $altura + '">'); 
    document.writeln(' <param name="movie" value="' + $arquivo + '" />'); 
    document.writeln(' <param name="menu" value="false" />');
    document.writeln(' <param name="wmode" value="transparent" />');
    document.writeln(' <embed src="' + $arquivo + '" type="application/x-shockwave-flash" wmode="transparent" menu="false" quality="high" id="' + $id + '" width="' + $largura + '" height="' + $altura + '"></embed>');
    document.writeln(' </object>');
}

exemplo da situação:

<html>
<body>
<div id="pode_nem_sempre_ser_o_mesmo">
  <div>
    <script>GerarSWF(bla,bla);
    //o conteudo tem q ficar dentro dessa div q está o <script>
    //mas pode aparecer em locais diversos, nem sempre saberei o id ou tag
    </script>
  </div>
</div>
</body>

tem como fazer isso? desde já agradeço a atenção

10
  • Já experimentaste o innerHTML ?
    – Edilson
    Commented 3/12/2015 às 14:18
  • Você pode colocar um id na div?
    – bfavaretto
    Commented 3/12/2015 às 14:19
  • Se bem que neste caso específico o document.write deve funcionar.
    – bfavaretto
    Commented 3/12/2015 às 14:24
  • @Edison, eu não sei como fazer isso sem especificar o id, tem como?
    – SuperMax
    Commented 3/12/2015 às 14:26
  • @bfavaretto, a chamada vem de dentro de artigos e já mtos já, não teria como mudar isso. Então, não tem como mudar e colocar um id, as vezes até tem , mas como disse não é sempre o mesmo
    – SuperMax
    Commented 3/12/2015 às 14:29

1 Resposta 1

4

Se for possível não declarar uma tag script chamando a função para adicionar o HTML à div em que se encontra. Você pode tentar criando uma div com atributos customizados e a partir disso buscar os elementos que possuam os atributos e adicionar o HTML, segue exemplo.

Você pode inspecionar o HTML para visualizar como ficou.

// Função para criar os SWF.
function appendSWF() {
  
  // Busca todos elementos com atribuito gera-swf.
  var swfs = document.querySelectorAll('[gera-swf]');
  
  Array.prototype.forEach.call(swfs, function(arr) {
    var eObj = document.createElement('object'),
      	eParam1 = document.createElement('param'),
      	eParam2 = document.createElement('param'),
      	eParam3 = document.createElement('param'),
      	eEmbed = document.createElement('embed'),
        eData = arr.getAttribute('swf-data'),
        eId = arr.getAttribute('swf-id'),
        eWidth = arr.getAttribute('swf-width'),
        eHeight = arr.getAttribute('swf-height');
    
    // Define atribuito estáticos.
    eObj.type = "application/x-shockware-flash";
    eParam1.name = 'movie';
    eParam2.name = 'menu';
    eParam2.value = 'false';
    eParam3.name = 'wmode';
    eParam3.value = 'transparent';
    eEmbed.type = "application/x-shockware-flash";
    eEmbed.wmode = 'transparent';
    eEmbed.menu = 'false';
    eEmbed.quality = 'high';
    
    // Define os atributos e seus valores no elemento Object.
    eObj.data = eData;
		eObj.id = eId;
    eObj.width = eWidth;
    eObj.height = eHeight;
    
    // Seta os atributos aos elementos param e adiciona ao elemento Object.
    eParam1.value = eData;
    eObj.appendChild(eParam1);
    eObj.appendChild(eParam2);
    eObj.appendChild(eParam3);
    
    // Seta os atributos ao elemento embed e adiciona ao elemento Object.
    eEmbed.src = eData;
    eEmbed.id = eId;
    eEmbed.width = eWidth;
    eEmbed.height = eHeight;
    eObj.appendChild(eEmbed);
    
    // Adiciona o elemento Object a div[gera-swf].
    
    arr.appendChild(eObj);
  });
}

document.addEventListener('DOMContentLoaded', appendSWF);
div {
  background-color: gray;
  margin: 5px;
}
<div gera-swf swf-data="text.txt" swf-id="1" swf-width="100" swf-height="100"></div>
<div gera-swf swf-data="file.txt" swf-id="2" swf-width="25" swf-height="25"></div>

Veja também no jsfiddle

@Edit Conforme mencionado nos comentários a necessidade de ser um elemento script com a chamada da função.

Desenvolvi este outro script, vou explica-lo. Ele pega todas as tags script dentro do body verifica quais possuem a palavra GerarSWF e seus respectivos parâmetros, se possuírem os valores correspondentes, cria a estrutura object com param e embed e adiciona à tag script em questão, após isso, remove a tag script. Acredito não ser uma das melhores alternativas, talvez se ajustar e ou melhorar algumas funcionalidades no script ele fique melhor.

<script>
function GerarSWF(pId, pFile, pWidth, pHeight) {
  document.addEventListener('DOMContentLoaded', function() {
    var allElements = document.body.getElementsByTagName('script');
    Array.prototype.forEach.call(allElements, function(arr) {
      if(arr.textContent.indexOf('GerarSWF') !== -1 &&
         arr.textContent.indexOf(pId)        !== -1 &&
         arr.textContent.indexOf(pFile)      !== -1 && 
         arr.textContent.indexOf(pWidth)     !== -1 && 
         arr.textContent.indexOf(pHeight)    !== -1 )  {
        
        var parent = arr.parentNode;
        var obj = document.createElement('object');
        obj.type = 'application/x-shockwave-flash';
        obj.id = pId;
        obj.data = pFile;
        obj.width = pWidth;
        obj.height = pHeight;
        
        var param1 = document.createElement('param');
        var param2 = document.createElement('param');
        var param3 = document.createElement('param');
        
        param1.name = 'movie';
        param2.name = 'menu';
        param3.name = 'wmode';
        
        param1.value = pFile;
        param2.value = 'false';
        param3.value = 'transparent';
        
        var embed = document.createElement('embed');
        embed.src = pFile;
        embed.type = obj.type;
        embed.menu = param2.menu;
        embed.wmode = param3.wmode;
        embed.quality = 'hight';
        embed.id = pId;
        embed.width = pWidth;
        embed.height = pHeight;
        
        obj.appendChild(param1);
        obj.appendChild(param2);
        obj.appendChild(param3);
        obj.appendChild(embed);
        
        parent.appendChild(obj);
        parent.removeChild(arr);
      }
    });
  });
};
</script>

<div id="a">
  <script>GerarSWF('id01','data.txt',10,10);</script>
</div>
<div id="b">
  <div id="c">
    <script>GerarSWF('id02','data2.txt',20,20);</script>
  </div>
  <div id="d">
    <script>GerarSWF('if00','file1.doc',100,1);</script>
  </div>
</div>

Obs: A deve ser declarada dentro da tag head da página.

Veja funcionando no jsfiddle

3
  • de qualquer forma eu teria q inserir essas div no local onde estiver a tag <script> e ai a sua função funcionaria. A minha grande duvida é como inserir algo onde o nome id ou a tag não é sempre a mesma? A unica coisa constante é ter q inserir dentro do mesmo elemento tag q está sendo chamada a função <script>GerarSWF()</script>
    – SuperMax
    Commented 3/12/2015 às 17:59
  • @SuperMax Desenvolvi outra maneira, conforme você explicou no comentário, dê uma analisada. Commented 3/12/2015 às 18:52
  • muito obrigado, funcionou muito bem. Só não entendi pq 3 itens não foram escritos no embed:: embed.menu = param2.menu; embed.wmode = param3.wmode; embed.quality = 'high'; . Mas creio q não deve ser um problema
    – SuperMax
    Commented 4/12/2015 às 2:09

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .