用javascript代码编写html

Question

我有一个滑动切换菜单，但只能将单词" menu“放在javascript中，但我想在它旁边添加一个图标。

如何在word MENU旁边添加<i class="fa fa-bars"></i>？

    $(document).ready(function(){

   $(".slidingDiv").hide();
   $(".show_hide").show();

   $('.show_hide').toggle(function(){
       $("#plus").text("MENU");
       $(".slidingDiv").slideDown();

   },function(){
       $("#plus").text("MENU");
       $(".slidingDiv").slideUp();
   });

});

Answer 1

$(document).ready(function(){

   $(".slidingDiv").hide();
   $(".show_hide").show();

   $('.show_hide').toggle(function(){
       $("#plus").html('<i class="fa fa-bars"></i> MENU');
       $(".slidingDiv").slideDown();

   },function(){
       $("#plus").html('<i class="fa fa-bars"></i> MENU');
       $(".slidingDiv").slideUp();
   });

});

尽管您只需要设置菜单项的html一次。不需要在显示和隐藏时设置它。

$(document).ready(function(){

   $(".slidingDiv").hide();
   $(".show_hide").show();
   $("#plus").html('<i class="fa fa-bars"></i> MENU');

   $('.show_hide').toggle(function(){
       $(".slidingDiv").slideDown();

   },function(){
       $(".slidingDiv").slideUp();
   });

});