在文本周围包装HTML

Question

这不太理想，但是我试图在我的标题周围包装一些HTML时没有选择。完全可以定位标题文本并围绕该文本包装HTML吗？

开始文字：

<div class="header-intro-text">
   <h1>New Business Conference</h1>
 </div>

使用添加的HTML结束文字

<div class="header-intro-text">
   <h1><a href="#">New Business Conference</a></h1>
 </div>

Answer 1

尝试：

$(".header-intro-text h1").wrapInner('<a href="#"></a>');

Answer 2

您应该可以使用jQuery执行以下操作：

$('h1').html('<a href="#">' + $('h1').text() + '</a>');

或多个标题

$('h1').each(function() {
    $(this).html('<a href="#">' + $(this).text() + '</a>');
});

Answer 3

var hit = $('.header-intro-text h1');
var hitText = hit.text();
hit.html($('<a href="#"></a>').text(hitText));

演示：http://jsfiddle.net/qwertynl/reV9V/

Answer 4

var word = 'Conference';

function highlight(word){
    var $container = $('.header-intro-text');
    $container.html(
        $container.html().replace(word, '<a href="#">'+word+'</a>')
    );
}