所以我最近需要将 html 导入另一个 html ，而且我也在使用语义 UI 的 css。
(我想制作一个带有语义 ui 的菜单并激活按钮，这样当我点击它们时，它们就可以工作)
所以这是我的 header.html 代码:-
<html>
<head>
<link rel="stylesheet" href="css/semantic/semantic.css"/>
<link rel="stylesheet" href="css/generic-style.css"/>
<link rel="stylesheet" href="css/style-profile.css"/>
<script src="js/jquery-3.1.0.min.js"></script>
<script src="js/semantic.min.js"></script>
</head>
<body>
<div class="ui menu no-borders menu2-padding" id="menu2">
<a class="green header link item">
<i class="shop icon"></i>
blah blah
</a>
<a class="green header link item">
<i class="shop icon"></i>
blah blah
</a>
<a class="green header link item">
<i class="shop icon"></i>
blah blah
</a>
</div>
<script>
$('.ui.menu a.item').on('click', function() {
$(this)
.addClass('active')
.siblings()
.removeClass('active');
})
</script>
</body>
</html>
我使用 w3data.js 将其包含到另一个 html 文件 (profile.html) 中，它是这样的:-
<head>
<script src="js/jquery-3.1.0.min.js"></script>
<script src="http://www.w3schools.com/lib/w3data.js"></script>
</head>
<body>
<div w3-include-html="header.html"></div>
<script>
w3IncludeHTML();
</script>
</body>
然而样式工作正常但是当我运行 profile.html 时，头文件中的 jquery 甚至不会工作(它只在 header.js 本身而不是在配置文件中工作。 HTML)。
那么知道我应该怎么做才能使主 html 读取我编写的脚本吗？
最佳答案
这对我有帮助，而不是那样:
<script>
$(document).ready(function(){
$.get( "header.html", function( data ) {
$( ".header-html" ).append(data);
});
$.get( "footer.html", function( data ) {
$( ".footer-html" ).append(data);
});
});
</script>
在 html 文件中:
<div class="header-html"></div>
<div class="footer-html"></div>
关于javascript - 使用来自 w3data 的包含 html，JavaScript ( jquery ) 不工作，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41427145/