Question

我想用JavaScript来注释div中的文本。

例如，我得到<div> This is a text</div>。我想使用代码，除非这是可见的，否则它会被注释掉。

 <!-- -->

我有3个标签，我可以点击以查看div中的其他文字，图片和视频。

以下是JSFiddle的样子。

我尝试更改文字并没有那么难，但我无法制作出符合我想要的方式的代码。我希望隐藏的div内容被注释掉，以免滞后于网站，但是当我点击一个隐藏的div时，我希望注释掉的部分能够被取消注释掉。

这是用于切换和隐藏div的脚本。

 $('.Options div').click(function() {
            var i = $(this).index();
            $('.Frames').hide();
            $('#Action' + (i + 1)).show();
        });

这是HTML代码：

<div class="Options">       
                <div class="OptionsTab">OptionRed</div>
                <div class="OptionsTab">OptionGreen</div>
                <div class="OptionsTab">OptionBlue</div>
 </div>

 <div class="Holder">
                <div class="Frames" id="Action1" style="display: block;">

                 <div style="font-size: 25px; color: white;"> This is a contained object</div>  

                </div>
                <div class="Frames" id="Action2">

                    <div style="font-size: 25px; color: white;"> This is a contained object</div>

                </div>
                <div class="Frames" id="Action3">

                    <div style="font-size: 25px; color: white;"> This is a contained object</div>

                </div>





        </div>

Answer 1

使用javascript注释不会节省内存或加载时间，因为源已经从服务器加载

而不是使用hide()隐藏节点（显示：无），您可以通过

删除客户端的节点

$('.Frames').remove();

Answer 2

1）使用一些data-属性来保存dataset中元素的当前内部html 2）用$('your_selector').html(" ")清除元素的当前内部html;
3）将内部html从data-属性返回到元素

https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/dataset

隐藏时注释掉元素

2 个答案: