无缝加载技术：如何动态加载其他 HTML 文件 (facebookPixel.html、help.html 等)
<!DOCTYPE html>
<html>
<head>
<title>Website</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
$(".Polaris-Button").click(function(e) {
e.preventDefault();
var target = $(this).data("target");
$("#content").load(target);
});
});
</script>
</head>
<body>
<div class="Polaris-Stack Polaris-Stack--distributionEqualSpacing Polaris-Stack--alignmentCenter" style="margin-top: 1px;border-bottom: 1px #c1c1c1 solid;padding: 5px;">
<div class="Polaris-Stack__Item">
<div class="Polaris-Stack Polaris-Stack--spacingTight Polaris-Stack--alignmentCenter">
<div class="Polaris-Stack__Item">
<div class="sc-1ibht3l-0 uqRZq">
</div>
<div class="sc-1ibht3l-1 hIZedH">
<div class="Polaris-ButtonGroup">
<div class="Polaris-ButtonGroup__Item">
<a data-polaris-unstyled="true" class="Polaris-Button" href="#" data-target="index.html">
<span class="Polaris-Button__Content">
<span class="Polaris-Button__Text">Dashboard</span>
</span>
</a>
</div>
<div class="Polaris-ButtonGroup__Item">
<a data-polaris-unstyled="true" class="Polaris-Button" href="#" data-target="zone.html">
<span class="Polaris-Button__Content">
<span class="Polaris-Button__Text">Checkout Zones</span>
</span>
</a>
</div>
<div class="Polaris-ButtonGroup__Item">
<a data-polaris-unstyled="true" class="Polaris-Button" href="#" data-target="funnel.html">
<span class="Polaris-Button__Content">
<span class="Polaris-Button__Text">Funnels</span>
</span>
</a>
</div>
<div class="Polaris-ButtonGroup__Item">
<a data-polaris-unstyled="true" class="Polaris-Button" href="#" data-target="help.html">
<span class="Polaris-Button__Content">
<span class="Polaris-Button__Text">Help Center</span>
</span>
</a>
</div>
<div class="Polaris-ButtonGroup__Item">
<div>
<button type="button" id="moreSetting" class="Polaris-Button" tabindex="0" aria-controls="Popover486" aria-owns="Popover486" aria-haspopup="true" aria-expanded="false">
<span class="Polaris-Button__Content">
<span class="Polaris-Button__Text">More</span>
<span class="Polaris-Button__Icon">
<span class="Polaris-Icon">
<svg viewBox="0 0 20 20" class="Polaris-Icon__Svg" focusable="false" aria-hidden="true">
<path d="M5 8l5 5 5-5z" fill-rule="evenodd"></path>
</svg>
</span>
</span>
</span>
<div id="dropdownContent" class="dropdown-content">
<!-- 这里放下拉列表的内容 -->
<a href="#" data-target="payment.html">Payment</a>
<a href="#" data-target="facebookPixel.html">Pixel</a>
</div>
</button>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="content"></div>
</div>
</div>
</body>
</html>
原文地址: https://www.cveoy.top/t/topic/p4Qv 著作权归作者所有。请勿转载和采集!