Question

我有一个C＃MVC Web应用程序（应用程序A），我想从另一个应用程序加载一个网页（P1）。我通过REST api调用获得了页面P1，详细信息和内容。当我将P1页面加载到我的A1中时，它会混乱我的CSS和JS，并覆盖A1 CSS / JS，其中一个P1来自其余的调用。

如何确保P1不会覆盖我的页面A1的CSS / JS？

Answer 1

我做类似的方法。我基本上采取其他应用程序的页面，并提取body元素，然后嵌入。使用该方法，未加载包含的应用程序的css

这是我如何做的示例代码：

function loadApp(url) {
    // fetch P1 page via jQuery
    $.get(url, function (data) {
        var page = $(data);

        // in the app I have a div with id "frame" where P1 should be loaded into
        $('#frame').html("");
        // in P1 I have a div with id "content" which should be included
        // all CSS and JS are outside
        page.find('#content').appendTo('#frame');

        // rewrite relative urls
        $('#frame').find('img').each(function (i) {
            var src = $(this).attr('src');
            if (!src.toLowerCase().startsWith('http://')) {
                $(this).attr('src', url + '/' + src);
            }
        });
    }, 'html');
}

将外部页面加载到我的网页中会更改布局

1 个答案: