在页面中包含html文件而不应用原始页面CSS/JS

Question

首先,我是新来的,如果这些问题写得不好,请原谅我.

有没有办法在不应用原始引用的CSS/JS的情况下包含单独的html文件？

例如,我有一个文件"index.php",其中有几个对外部样式表的引用.

<!-- Bootstrap Core CSS -->
    <link rel="stylesheet" href="css/bootstrap.min.css" type="text/css">

<!-- Custom Fonts -->
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Merriweather:400,300,300italic,400italic,700,700italic,900,900italic' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="font-awesome/css/font-awesome.min.css" type="text/css">

然后我包含另一个文件navbar.html及其自己的外部样式表引用.

<link href="navbar.css" rel="stylesheet">

但是,原始文件的CSS和JS似乎总是适用于包含的文件,不幸的是,这经常会导致包含的页面被不适当地设置样式.

有没有办法在仅应用其所需的CSS和JS时包含页面？

我发现IFrame很有用,我正在寻找一种不使用它们的解决方案,因为它们并不总是与浏览器兼容,并且不会动态改变形状.例如,如果导航栏具有下拉链接,则不会显示,因为iframe具有设置的大小.

Answer 1

我认为据我所知，你想做的事情是不可能的。因为当您在 html 中包含任何文件时，在您的情况下，它的 navbar.html 当它在浏览器上呈现时，最终会被视为单个 html 文件。将所有 css / js 应用于同一个 html 页面。

因此，您可以在 navbar.html 和 css 中使用不同的类名。所以它不会影响其他index.html元素。

希望对您有帮助。