动态加载内容

我有一个活动网站，周一到周日的网页。页面中使用的代码是相同的。唯一不同的是内容和元标签。点击星期一或星期二等链接时，如何只有一个网页加载适当的内容。这也会影响SEO吗？谢谢！动态加载内容

<nav class="menu"> 
    <ul> 
     <a href=""><li>Monday</li></a> 
     <a href=""><li>Tuesday</li></a> 
     <a href=""><li>Wedneday</li></a> 
     <a href=""><li>Thursday</li></a> 
     <a href=""><li>Friday</li></a> 
     <a href=""><li>Saturday</li></a> 
     <a href=""><li>Sunday</li></a> 
    </ul> 
</nav> 

<div class="content"> 
    <div class="article"><!--the days content--></div> 
    <div class="article"><!--the days content--></div> 
    <div class="article"><!--the days content--></div> 
</div>

来源

2016-07-26 Max Njoroge

有太多可能的答案或者对这种格式太好的答案太长。请添加详细信息以缩小答案集或隔离可以在几个段落中回答的问题。我建议您找到一个开发论坛（可能是[Quora]（http://www.quora.com/Computer-Programming）？）来计算一般性。然后，当/如果您有特定的编码问题，请回到StackOverflow，我们很乐意提供帮助。 –

你可以有多个div你想要的内容，隐藏和显示你需要的。

在HTML

<div id="container"> 
    <button id="btnChange">Change Content</button> 
    <div id="red"> 
    This is red content 
    </div> 
    <div id="blue"> 
    This is blue content 
    </div>

在CSS

#container { 
    width:100%; 
    height: 100px; 
    background-color: green; 
    text-align: center; 
} 

#red { 
    width:100%; 
    height: 100%; 
    background-color: red; 
} 

#blue{ 
    width:100%; 
    height: 100%; 
    background-color: blue; 
    display: none; 
}

jQuery中

$(document).ready(function() { 
       var content = "red"; 
     $("#btnChange").click(
      function() { 
       if(content == "red"){ 
        $("#red").hide(); 
        $("#blue").show(); 
        content = "blue"; 
       }else if (content == "blue"){ 
        $("#blue").hide(); 
        $("#red").show(); 
        content = "red"; 
       } 
      }    
     ); 
    });

继承人的fiddle

其他方式更优雅，但复杂的是有一个共同ntent div，并通过从jquery到php的ajax调用加载内容，然后使用jquery清除并重新填充div。

希望它有帮助

来源

2016-07-26 19:59:41 CardCaptor

动态加载内容

回答

相关问题