如何使用javascript刪除字符？

Question

如何使用javascript在Cite:之後刪除,？

<div id="mydiv"> 
    <div> 
    ::before 
    <div> 
     <blockquote> 
     <p></p> 
     <p></p> 
     <p></p> 
     <cite> 
      ::before 
      "Cite:, " 
      <a href=""></a> 
     </cite> 
     </blockquote> 
    </div> 
    </div> 
</div> 

Answer 1

在一般意義上，去除串逗號很容易用正則表達式.replace()：

someString = someString.replace(/Cite:,/,"Cite:"); 

您可以應用到HTML元素的內容如下：

var cite = document.querySelector("#mydiv cite"); 
 
cite.innerHTML = cite.innerHTML.replace(/Cite:,/,"Cite:");

<div id="mydiv"> 
 
    <div> 
 
    ::before 
 
    <div> 
 
     <blockquote> 
 
     <p></p><p></p><p></p> 
 
     <cite> 
 
      ::before 
 
      "Cite:, " 
 
      <a href=""></a> 
 
     </cite> 
 
     </blockquote> 
 
    </div> 
 
    </div> 
 
</div>

...但請注意，它將重新創建引用元素的所有子元素，包括錨點，這將刪除已綁定到錨點的所有事件偵聽器。

Answer 2

我刪除的內容，我認爲你喜歡::before HTML源代碼複製粘貼，但你可以使用jQuery

$('cite')[0] 
 
    .innerHTML = $('cite')[0] 
 
    .innerHTML 
 
    .trim() 
 
    .replace(',', '');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="mydiv"> 
 
    <div> 
 
    <div> 
 
     <blockquote> 
 
     <p></p> 
 
     <p></p> 
 
     <p></p> 
 
     <cite> 
 
      "Cite:, " 
 
      <a href="">link</a> 
 
     </cite> 
 
     </blockquote> 
 
    </div> 
 
    </div> 
 
</div>

Answer 3

而不是使用innerHTML屬性替換元素的含量的<cite>，最好只更改包含"Cite:,文本的文本節點的內容。在這種情況下，我們知道文本節點將是<cite>的firstChild。在更復雜的HTML中，搜索<cite>下適當的文本節點可能更合適。

以下代碼將僅更改文本。它不會干擾錨點，<a>。它將保留可能在該節點上的任何監聽器（或者如果HTML實際上更復雜，則爲<cite>的任何其他子節點）。 [注：此代碼是基於什麼在answer to this question提供nnnnnn]

var cite = document.querySelector("#mydiv cite"); 
 
//In this instance, we know the text we want to modify will be in the text node 
 
// which is the firstChild of the <cite>. 
 
cite.firstChild.textContent = cite.firstChild.textContent.replace(/Cite:,/,"Cite:");

<div id="mydiv"> 
 
    <div> 
 
    ::before 
 
    <div> 
 
     <blockquote> 
 
     <p></p><p></p><p></p> 
 
     <cite> 
 
      ::before 
 
      "Cite:, " 
 
      <a href=""></a> 
 
     </cite> 
 
     </blockquote> 
 
    </div> 
 
    </div> 
 
</div>