脚本完成后修改动态元素

时间:2015-12-22 16:05:32

标签: javascript html

我对JavaScript比较陌生,所以请耐心等待。

我运行Blackboard Learn LMS的一个实例。以后为我感到难过。 Blackboard向最终用户显示不同的模块以显示不同的信息。 公告模块包含不可编辑的代码,它发送Ajax请求以显示该特定用户的所有系统范围和特定于课程的公告:

<div id="Announcements">
    <div id="div_1_1"> </div>
    <script type="text/javascript">
        Event.observe(window, 'load', function () {
            new Ajax.Request('/webapps/portal/execute/tabs/tabAction', {
                method: 'post',
                parameters: 'action=refreshAjaxModule&modId=_1_1&tabId=_2830_1&tab_tab_group_id=_155_1',
                onSuccess: function (transport) {
                    try {
                        var res = transport.responseXML.getElementsByTagName('contents')[0].firstChild.nodeValue;
                        $('div_1_1').innerHTML = res.stripScripts();
                        page.globalEvalScripts(res, true);
                    } catch (e) {
                        $('div_1_1')
                            .innerHTML = 'Module information is temporarily unavailable. Please reload the page. <!--' + e.toString()
                            .escapeHTML()
                            .gsub('-', '&#045;') + '-->';
                    }
                },
                onFailure: function (transport) {
                    $('div_1_1').innerHTML = 'Error loading module.';
                }
            });
        });
    </script>
</div>

该模块提供了许多我想隐藏的冗余信息。由于无法编辑该特定代码,我一直试图找到一种方法来执行以下操作之一:

  1. 使用页面上其他来源的附加脚本修改模块的内容。

  2. 将模块的内容复制到新的可编辑模块,然后显示该模块,

  3. 两种方法都被证明是不可能的,因为公告模块中的脚本只在页面完全加载后运行,因此之后无法运行脚本或等到进程完成。

    关于如何在不直接编辑代码的情况下修改内容的任何想法?

1 个答案:

答案 0 :(得分:0)

我最终使用了DOMSubtreeModified事件:

<script type="text/javascript">
    $j = jQuery.noConflict();p
    $j("#div_1_1").on("DOMSubtreeModified", function () {
        var div = document.getElementById("div_1_1");
        var inner = div.innerHTML;
        inner = inner.substring(
            inner.indexOf("<!-- Display course/org announcements -->")
        );
        div.innerHTML = inner;
    });
</script>