javascript - 删除 div 折叠上的链接文本？

Question

下面的代码用于隐藏和取消隐藏 div，但是我们如何删除点击时的链接文本“搜索”并显示减号？

<div class="expandContent"><a href="#" title="Click here to search."> &nbsp; &nbsp; 
    <i class='icon-search' title='Click here to search.'></i> SEARCH </a>
</div>
<div class="showMe" style="display:none">

<script type="text/javascript">
$('.expandContent').click(function(){
        $('.showMe').slideToggle('slow');
    });
    </script>

Answer 1

如果我理解正确的话，您似乎想使用图标切换搜索结果。我使用类似的方法使用 <button>元素(而不是 anchor 元素)。

+和-按钮元素内部使用 jQuery 的 text() 进行切换以及 conditional ternary operator :

$('.btn-search').click(function() {
  $(this).text() === '+' ?  $(this).text('-') : $(this).text('+');
  $('.showMe').slideToggle('slow');
});

.showMe {
  border: 2px solid crimson;
  padding: 10px;
  margin-top: 10px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button class="btn-search">+</button>

<div class="showMe" style="display:none">
  <p>Search results go here...</p>
</div>