我一直在寻找一天左右如何用JS或jQuery做些什么,并找到了几个解决方案,但还没有什么可靠的.

我想用这个:

<code class="codeIt">

  <h2> This is an H2 </h2>

</code>

我希望输出为:

<h2> This is an H2 </h2>

我知道我可以做到这一点:

<code class="codeIt">

  &lt;h2&gt; This is an H2 &lt;/h2&gt;

</code>

...但我不想手动搜索并替换我在这些块中的代码,而是在浏览器中即时完成.这可能吗？

我很喜欢jQuery,所以我尝试过.replaceWith或者是JavaScript,.replace但到目前为止我还没有得到它需要的地方.我正在替换整个标签或做其他错误.

我的问题是:我怎么会写一个简单的jQuery(或定期JS)帮我代替我<和我>与HTML实体喜欢<和>我的内<code>标签.

我感谢任何帮助,谢谢.

更新:

我设法让它工作得很好@Prisoner如何解释,它非常漂亮,但是在我的特殊情况下需要稍微扩展,因为我有一个以上的代码块.codeIt,所以我必须检查每个元素和输出...否则它将保持相同的输出(如第一个块)

这是小提琴

感谢大家的回答.

我想在header元素的中间显示一个CSS水平菜单,并确保在调整浏览器窗口大小时它保持在中间位置.我当然尝试过margin: auto;,但它也不适用于我.

jsfiddle代码

header .center {
  background: url(../images/header-center.png) no-repeat;
  width: 510px;
  height: 100%;
  /*margin: auto;*/
}

我尝试了很多解决方案,但没有任何方法可以帮助我.当我在特定HTML中的"公司"子菜单上时,我想让我的父元素保持悬停状态.

我的HTML

<nav class="main-menu">
  <ul class="sf-menu sf-js-enabled">
    <li><a href="index.html" class="sf-with-ul">company<span class="menu-arrow"></span><em></em></a>
      <ul >
        <li><a href="#">Welcome Message</a></li>
        <li class=""><a href="#" class="sf-with-ul">Company Profile<span class="menu-arrow"></span></a>
          <ul>
            <li><a href="#">Our Capabilities</a></li>
          </ul>
        </li>
        <li><a href="#">Our History</a></li>
      </ul>
    </li>
    <li class="current"><a href="services.html">services</a></li>
  </ul>
  <div class="clear"></div>
</nav>

我的CSS:

nav {
position:relative;
background:url(../images/theme/nav.png) repeat-x #e7e7e7;
min-height:68px;
margin:0;
}

.sf-menu ul {
position:absolute;
top:-999px;
display:none;
}

.sf-menu ul li {
width:100%;
}

.sf-menu li {
float:left;
position:relative;
}

.sf-menu>li>a {
display:block;
font-size:12px;
line-height:17px;
color:#2f2e2e;
font-weight:bold;
text-transform:uppercase;
width:189px;
text-align:center;
position:relative; …