Question

我有一个函数，它将html作为字符串。

然后想象我想用一个新的链接网址替换所有链接网址，而不必处理任何正则表达式：

function myFunction(html_as_string) {
    $(html_as_string).find('a').each(function() { // yes this actualy works
        $(this).attr('href', 'http://some-other-link.whatever');
    });
}

var html_as_string = '<div>Lorem ipsum dolor sit <a href="http://foo.com">foo</a>Lorem ipsum dolor <a href="http://bar.com">bar</a>Lorem ipsum.</div>';

myFunction(html_as_string);

好的链接'url在函数内部被改变了，但是我怎么能用新的url获取新的html_as_string变量？

修改

即使在同一级别上有多个标记元素，它也必须工作，例如在上面提到的字符串后添加<h1>Foo</h1>。

Answer 1

将html插入临时元素，处理它，然后使用jQuery's .html() method将容器的子元素再次转换回HTML字符串：

function myFunction(html_as_string) {
    var $container = $("<div />");
    $(html_as_string).appendTo($container);
    $container.find('a').each(function() { // yes this actualy works.
        $(this).attr('href', 'http://some-other-link.whatever');
    });
    return $container.html();
}

var html_as_string = '<h1>Foo</h1><div>Lorem ipsum dolor sit <a href="http://foo.com">foo</a>Lorem ipsum dolor <a href="http://bar.com">bar</a>Lorem ipsum.</div>';

console.log(myFunction(html_as_string));

示例：http://jsfiddle.net/h9sfdodx/3/

Answer 2

我怎么能用新网址
来获取新的html_as_string变量

这就是你要找的东西吗？

function myFunction(html_as_string) {
  var t=  $(html_as_string).find('a').each(function() { // yes this actualy works.
        $(this).attr('href', 'http://some-other-link.whatever');
    }).end();

return t; // if you want it as a string use t.html() , else use t.
}

Answer 3

返回新DOM的outerHTML：

function myFunction(html_as_string) {
    html_as_string = $(html_as_string);
    html_as_string.find('a').each(function() { // yes this actualy works.
        $(this).attr('href', 'http://some-other-link.whatever');
    });
    return html_as_string[0].outerHTML;
}

var html_as_string = '<div>Lorem ipsum dolor sit <a href="http://foo.com">foo</a>Lorem ipsum dolor <a href="http://bar.com">bar</a>Lorem ipsum.</div>';

html_as_string = myFunction(html_as_string);

在jQuery更改字符串后获取字符串

3 个答案: