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

前端之家收集整理的这篇文章主要介绍了javascript – 在页面中包含html文件而不应用原始页面CSS / JS前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
首先,我是新来的,如果这些问题写得不好,请原谅我.

有没有办法在不应用原始引用的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,300italic,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具有设置的大小.

解决方法

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

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

希望它能帮到你.

猜你在找的JavaScript相关文章