2

使用 jQuery，如何将“章节标题”移动到“1.1”旁边，使其显示为 ...“1.1 章节标题”，同时保持其他所有内容不变？

<p>
  1.1
  <a name="_Toc159407685"></a>
  <a name="_Toc161121797"></a>
  <a name="_Toc208282996"></a>
  <a name="_Toc315779471"></a>
  <a href="link.jpg">
  <img class="img" alt="" src="link.jpg">
  </a>
  Chapter Title
</p>
4

3 回答 3

6

给你：

$("p").append($("p *").detach());​

演示：http: //jsfiddle.net/MwDc6/

于 2012-11-14T10:22:00.653 回答
2

我建议使用纯 JavaScript 方法：

function moveTitle(el) {
    if (!el) {
        return false;
    }
    else {
        var titleNode = el.lastChild,
            title = document.createTextNode(titleNode.nodeValue.trim()),
            number = el.firstChild;
        el.removeChild(titleNode);
        el.insertBefore(title, number.nextSibling);
    }
}

moveTitle(document.getElementsByTagName('p')[0]);

JS 小提琴演示。

虽然这确实做了一些假设：

  • 您要移动的标题将始终是元素的最后一个子元素，
  • 最后一个孩子永远是一个textNode, 和
  • 您总是希望将标题移动到元素的第一个子元素之后的位置。

当然，这些假设可以改变或适应；但鉴于您提出的要求，它应该足以满足您的用例。

于 2012-11-14T10:44:29.513 回答
1

你可以这样做：

$('p:contains("1.1")').each(function(){
    var text = $(this).text();
    txt = text.replace(new RegExp("chapter title", "g"), '');
    txt = text.replace(new RegExp("1.1", "g"), '1.1 chapter title');
    $(this).html(txt);
});
于 2012-11-14T10:33:36.720 回答