Javascript 删除“|&引用；从html

我没有编辑html的权限，所以有没有办法用css删除下面每个a标记之间的“|”。如果不使用css，则可能使用javascript或jquery

<span class="reportnavigation">
    <span class="reportnavigationheader">
        Go To Week: 
    </span>
    <a href="/2014/options?L=33742&W=1&O=06&F=0000"></a>
     | 
    <a href="/2014/options?L=33742&W=2&O=06&F=0000"></a>
     | 
    <a href="/2014/options?L=33742&W=3&O=06&F=0000"></a>
     | 
    <a href="/2014/options?L=33742&W=4&O=06&F=0000"></a>
     | 
    <a href="/2014/options?L=33742&W=5&O=06&F=0000"></a>
     | 
    <a href="/2014/options?L=33742&W=6&O=06&F=0000"></a>
     | 
    <a href="/2014/options?L=33742&W=7&O=06&F=0000"></a>
</span>

进入下一周：
| 
| 
| 
| 
| 
| 

使用jQuery：

$('.reportnavigation').contents().filter(function() {
     return this.nodeType === 3 && $.trim(this.nodeValue) === '|';
}).remove();

---

如注释中所述，您可以使用正则表达式替换它：

$('.reportnavigation').html($('.reportnavigation').html().replace(/\|/g,''));

---

我知道您有很多JavaScript解决方案，但是使用JavaScript替换HTML需要重新初始化绑定在元素上的任何事件，例如，单击

上的事件纯CSS解决方案怎么样


body {
  background-color: white;
}
a + a {
  background-color: white;
  margin-left: -0.43em;
}
a {
  margin-right: 20px; /* whatever value you want */
}

这个
-0.43em
值是从雅虎借来的！纯CSS框架：

这相当于4px的空白宽度，只是更兼容。它解决了（在CSS中）显示为内联块的块之间存在4px间距的问题，并可在此处通过叠加下一个字符来隐藏字符。
Java？你是说JavaScript，对吗？您尝试过什么？使用简单的正则表达式和jquery很容易处理。+1因为这是唯一一种不会干扰绑定到元素的任何可能事件的方法。我注意到Firefox中有一种奇怪的行为。在带有935x834视口的949x981窗口中，整个HTML包含在3行中。在第二行的末尾，可以看到
|
字符。同样的情况也发生在Chrome上，但窗口的宽度要小一些。
body {
  background-color: white;
}
a + a {
  background-color: white;
  margin-left: -0.43em;
}
a {
  margin-right: 20px; /* whatever value you want */
}