将主页的侧边栏链接到所有网页

时间:2017-03-27 11:09:16

标签: javascript html css

Picture of my Sidebar

你可以看到我在图片上的侧边栏,我想将该侧边栏链接到我网站的其他页面,这样当它编辑主页面上的侧边栏时,我也会在其他页面上生效,我应该这样做吗?这是我的侧边栏代码,以防您需要查看

<div id="site_content">
    <div class="sidebar">
        <!-- insert your sidebar items here -->
        <h3>Events</h3>
        <h4>Test Event Name</h4>
        <h5>Test Date</h5>
        <p>Test event</p>
        <p>Test event</p>
        <p>Test event</p>
        <p>Test event</p>
        <p>Test event</p>
        <p>Test event</p>

        <div id="images">
            <img id="image1" src="http://i.imgur.com/dL3io.jpg" />
            <img id="image2" src="http://i.imgur.com/qASVX.jpg" />
            <img id="image3" src="http://i.imgur.com/fLuHO.jpg" />
            <img id="image4" src="http://i.imgur.com/5Sd3Q.jpg" />
        </div>
        <div id="slider">
            <a href="#image1">1</a>
            <a href="#image2">2</a>
            <a href="#image3">3</a>
            <a href="#image4">4</a>
        </div>
        <ul class="slidess">

            <h4>&nbsp;</h4>
            <h4>Opening Hours</h4>

            <h5> Mon - 5:00am - 6:00pm</h5>
            <h5>Tue - 5:00am - 6:00pm</h5>
            <h5>Wed - 5:00am - 6:00pm</h5>
            <h5>Thu - 5:00am - 6:00pm</h5>
            <h5>Fri - 5:00am - 6:00pm</h5>
            <h5>Sat - 5:00am - 6:00pm</h5>
            <h5>Sun - 5:00am - 6:00pm<br></h5>

            <h3>&nbsp;</h3>
            <h3>&nbsp;</h3>
    </div>
</div>

1 个答案:

答案 0 :(得分:0)

您可以使用jQuery来实现这一目标。

<head>
<title></title>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script> 
$(function(){
  $("#sidebar").load("sidebar.html");
});
</script>
<body>
<div id="header"></div>
</body>
</head>

然后将侧边栏内容添加到另一个名为sidebar.html的页面。