javascript - 将 article 替换为带有一个按钮的 div，该按钮将保留并可以在 article 和 div 内容之间切换

Question

我希望在单击按钮时使用 jQuery 在文章和 div 之间切换内容。jQuery 到目前为止，但它没有按预期工作。我只有这些，如果你们能指导我，我将不胜感激。

   $('.gal').on('click',function(){
    		if($('article').css('display')!='none'){
    			$('#vnav').html($('#vnav').html()).show().siblings('div').hide();
    			 }else if($('#vnav').css('display')!=='none'){
    				  $('#vnav').show().siblings('div').hide();}
    	});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="gal">Gallery</button></div>
    
    <article>some content inside</article>
    
    <div id="vnav" style="display:none;">
    	<ul id="horizontal"> 
    		<li><img src="images/1.jpg" width="782" alt="" height="440" /></li> 
    		<li><img src="images/2.jpg" width="782" alt="" height="440" /></li> 
    		<li><img src="images/3.jpg" width="782" alt="" height="440" /></li> 
    		<li><img src="images/4.jpg" width="782" alt="" height="440" /></li> 
    		<li><img src="images/5.jpg" width="782" alt="" height="440" /></li> 
    	</ul> 
    </div>

提前致谢!

Answer 1

您只需要编写此代码以在单击按钮时在 article 和 div 之间切换。

$('.gal').on('点击',function(){
$('文章').toggle();
$('#vnav').toggle();
});