document.writeln () ломает мое частичное обновление jQuery. Как я могу решить это?

Question

У меня проблемы с записью приведенного ниже HTML-кода на страницу после асинхронного запроса get. HTML предоставляется сторонним сервисом построения графиков, поэтому я не могу изменить его самостоятельно, кроме случаев, когда я получаю ответ после $.get().

Некоторое время назад я задал следующий вопрос: Почему этот HTML-код приводит к тому, что страница становится пустой . Ответ был:

"document.write после того, как страница полностью отрендерено ... создаст новый документ "

Можно ли заменить функцию document.writeln() функцией jQuery, которая будет включать HTML-код в DOM? Если так, что мне нужно сделать?

это случай поиска и замены? Или это вообще сработает? Есть ли другой способ решить эту проблему?

<!-- Chart by Corda Enterprise Server (PopChart, Highwire) Version 7.2.3.3177 (Jun 11, 2008) .NET Embedder 7.1.0.2116 -->

<script type="text/javascript">
    var put2087644907Props;
    var put1181439927Props;
    var put433403842Props;

    function getImageMap1325059360() {
        put2087644907Props = new PopUpProperties;
        put2087644907Props.width = 400;
        // lots more of these properties being set 


        // not sure exactly, but this has something to do with providing hover-over functionality
        document.writeln('<map name="imVB_2wFC_WSdl" id="imVB_2wFC_WSdl"><area shape="poly" coords="540,52,547,52,547,59,540,59,540,52" onmouseover="return showPopUp ? showPopUp(put2087644907Props, \'VB_2wFC_WSdl\', \'Schroder All Mats Idx Lnkd Bd I Acc 2.58%\', 543, 49) : false;"/> /* big long string */ onmouseover="return hidePopUp ? hidePopUp() : false;"/></map>');
    }
</script>
<script type="text/javascript">

    document.writeln('<script type="text/javascript" src="http://ie-sv-corda72:2001/?jsPopUp"></scr'+'ipt>');

    if(document.layers) getImageMap1325059360();

</script>
<img id="VB_2wFC_WSdl" name="VB_2wFC_WSdl" width="570" height="243" style="border: 0;"
    usemap="#imVB_2wFC_WSdl" src="http://ie-sv-corda72:2001/?@_CPRVB_2wFC_WSdl" />
<script type="text/javascript">
    if (!document.layers) getImageMap1325059360();
</script>
<noscript>
    <map name="imVB_2wFC_WSdl" id="imVB_2wFC_WSdl">
        <area shape="poly" coords="540,52,547,52,547,59,540,59,540,52" alt="Schroder All Mats Idx Lnkd Bd I Acc 2.58%" />
        <area shape="poly" coords="497,41,504,41,504,48,497,48,497,41" alt="Schroder All Mats Idx Lnkd Bd I Acc 3.27%" />
        <%--lots of these area elements which gives the chart hover-text functionality--%>
    </map>
</noscript>

<!-- Corda Enterprise Server (PopChart, Highwire) Version 7.2.3.3177 (Jun 11, 2008) .NET Embedder 7.1.0.2116 by corda.com -->

Для справки, это код, который получает:

$.get(url, {}, function (result) {

    $('#FactsheetTabs .tab_container').fadeOut(100, function () {
        $('#tabs')
            .append(result) // this fails in FireFox & chrome, but not IE... why?!
            .fadeIn(100);
    });
}, 'html');

Если я отредактирую ответ, чтобы закомментировать код document.writeln(), как показано ниже, это сработает:

$.get(url, {}, function (result) {

    $('#FactsheetTabs .tab_container').fadeOut(100, function () {
        result = result.replace("document.writeln", "//document.writeln");
        result = result.replace("document.writeln", "//document.writeln");
        $('#tabs')
            .append(result) // this works now...
            .fadeIn(100);
    });
}, 'html');

Answer 1

Вы можете переопределить функцию document.writeln() с помощью одной из своих собственных функций, которая безопасно добавит HTML-код в DOM, не нарушая его.Например:

document.writeln = function (html) {
    $(document.body).append(html);
}

Другой вариант близок к вашему методу замены, но вместо добавления разделителей комментариев замените document.write вашим собственным методом:

result = result.replace(/document\.writeln/g, "$(document.body).append");