Por que dividir a tag <script> ao escrevê-la com document.write ()?

Por que alguns sites (ou anunciantes que fornecem código javascript aos clientes) empregam uma técnica de dividir as tags <script>e / ou </script>tags nas document.write()chamadas?

Notei que a Amazon também faz isso, por exemplo:

<script type='text/javascript'>
  if (typeof window['jQuery'] == 'undefined') document.write('<scr'+'ipt type="text/javascript" src="http://z-ecx.images-amazon.com/images/G/01/javascripts/lib/jquery/jquery-1.2.6.pack._V265113567_.js"></sc'+'ript>');
</script>

</script>precisa ser interrompido porque, caso contrário, encerraria o <script></script>bloco anexo muito cedo. Realmente, ele deve ser dividido entre the <e the /, porque um bloco de script deve (de acordo com SGML) terminar com qualquer sequência de fim de tag aberta (ETAGO) (ou seja </) :

Embora os elementos STYLE e SCRIPT usem CDATA para seu modelo de dados, para esses elementos, o CDATA deve ser tratado de maneira diferente pelos agentes do usuário. A marcação e as entidades devem ser tratadas como texto bruto e passadas para o aplicativo como estão. A primeira ocorrência da sequência de caracteres " </" (delimitador aberto da tag final) é tratada como finalização do final do conteúdo do elemento. Em documentos válidos, essa seria a tag final do elemento.

No entanto, na prática, os navegadores apenas finalizam a análise de um bloco de script CDATA em uma </script>marca de fechamento real .

No XHTML não existe um tratamento especial para blocos de script, portanto, qualquer <(ou &) caractere dentro deles deve ser &escaped;semelhante a qualquer outro elemento. No entanto, os navegadores que estão analisando XHTML como HTML da velha escola ficarão confusos. Existem soluções alternativas que envolvem blocos CDATA, mas é mais fácil simplesmente evitar o uso desses caracteres sem escape. Uma maneira melhor de escrever um elemento de script a partir de um script que funcione em qualquer tipo de analisador seria:

<script type="text/javascript">
    document.write('\x3Cscript type="text/javascript" src="foo.js">\x3C/script>');
</script>

Aqui está outra variação que eu usei ao querer gerar uma tag de script embutida (para que seja executada imediatamente) sem precisar de nenhuma forma de escape:

<script>
    var script = document.createElement('script');
    script.src = '/path/to/script.js';
    document.write(script.outerHTML);
</script>

(Observação: ao contrário da maioria dos exemplos na rede, não estou definindo type="text/javascript"nem a tag anexa nem a gerada: não há navegador que não a tenha como padrão e, portanto, é redundante, mas também não prejudicará, se você discordar).

Eu acho que é para impedir que o analisador HTML do navegador interprete o <script> e, principalmente, o </script> como a tag de fechamento do script real, no entanto, não acho que usar document.write seja uma excelente idéia para avaliar o script blocos, por que não usar o DOM ...

var newScript = document.createElement("script");
...

A solução que Bobince postou funciona perfeitamente para mim. Eu também queria oferecer um método alternativo para futuros visitantes:

if (typeof(jQuery) == 'undefined') {
    (function() {
        var sct = document.createElement('script');
        sct.src = ('https:' == document.location.protocol ? 'https' : 'http') +
          '://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js';
        sct.type = 'text/javascript';
        sct.async = 'true';
        var domel = document.getElementsByTagName('script')[0];
        domel.parentNode.insertBefore(sct, domel);
    })();
}

Neste exemplo, incluí uma carga condicional para o jQuery demonstrar caso de uso. Espero que seja útil para alguém!

A parte </script>interna da string Javascript é interpretada pelo analisador HTML como uma tag de fechamento, causando comportamento inesperado ( veja o exemplo no JSFiddle ).

Para evitar isso, você pode colocar seu javascript entre os comentários (esse estilo de codificação era uma prática comum, quando o Javascript era pouco suportado pelos navegadores). Isso funcionaria ( veja o exemplo no JSFiddle ):

<script type="text/javascript">
    <!--
    if (jQuery === undefined) {
        document.write('<script type="text/javascript" src="http://z-ecx.images-amazon.com/images/G/01/javascripts/lib/jquery/jquery-1.2.6.pack._V265113567_.js"></script>');
    }
    // -->
</script>

... mas, para ser sincero, usar document.writenão é algo que eu consideraria uma prática recomendada. Por que não manipular o DOM diretamente?

<script type="text/javascript">
    <!--
    if (jQuery === undefined) {
        var script = document.createElement('script');
        script.setAttribute('type', 'text/javascript');
        script.setAttribute('src', 'http://z-ecx.images-amazon.com/images/G/01/javascripts/lib/jquery/jquery-1.2.6.pack._V265113567_.js');
        document.body.appendChild(script);
    }
    // -->
</script>