Javascript Html更改标签文本的一部分

我有以下javascript代码：

window.toggle = function() {
 if( document.getElementById("calendar").style.display=='none' ){
     document.getElementById("calendar").style.display = '';
     $(".icon-chevron-down").removeClass("icon-chevron-down").addClass("icon-chevron-up");
     document.getElementById("label").innerText = "Hide calendar";
 } else {
     document.getElementById("calendar").style.display = 'none';
     $(".icon-chevron-up").removeClass("icon-chevron-up").addClass("icon-chevron-down");
     document.getElementById("label").innerText = "Show calendar";
 }
}  

我只想更改标签的一部分，因为我不想删除引导图标。就像这里：

你有什么建议如何应对这种令人失望的引导图标吗

编辑：

也许我会写一些我想要的例子：

v“显示日历”

^“隐藏日历”

v“显示日历”

^“隐藏日历”

---

等等…

我认为这是innerHTML而不是innerText。

您面临的问题是因为您正在更改带有ID标签的元素的内部文本。。。。除了文本外，该标签还有两个图标元素

我所做的是将文本“隐藏日历”和“显示日历”放入一个ID为的span中，然后更改span的内部文本（而不是标签） 因此，我们没有：

<i class="icon-chevron-down"></i>
    Show calendar  
<i class="icon-calendar"></i>

到

---

希望这能有所帮助。

对于文本，它要么是

textContent

（Mozilla、Webkit、Opera），要么是

innerText

（对于IE）

innerHTML

顾名思义，是用来设置HTML的。谢谢大家，但我想做的是将“show calendar”中的“show”改为“hide”文本。它似乎不起作用？没问题。很高兴我能帮忙：）

<i class="icon-chevron-down"></i>
    <span id="display_text">Show calendar</span>  
<i class="icon-calendar"></i>

document.getElementById("label").innerText = "Hide calendar";
document.getElementById("label").innerText = "Show calendar";

document.getElementById("display_text").innerText = "Hide calendar";
document.getElementById("display_text").innerText = "Show calendar";