4

我正在尝试创建我的第一个 chrome 扩展。基本上我想在当前加载的文档中搜索所有类名为“child”的链接。我需要检索每个链接的 href 值。然后我想将它克隆到另一个名为“child_two”的类中。在新克隆的元素上，href 将被替换为修改过的元素。

这是目标文档。

<div class="parent">
    <a href="http://www.example1.com" class="child">name1</a>
</div>
<div class="parent">
    <a href="http://www.example2.com" class="child">name2</a>
</div>
<div class="parent">
    <a href="http://www.example3.com" class="child">name3</a>
</div>
<div class="parent">
    <a href="http://www.example4.com" class="child">name4</a>
</div>
<div class="parent">
    <a href="http://www.example5.com" class="child">name5</a>
</div>

我希望结果是这样的。

<div class="parent">
    <a href="http://www.example1.com" class="child">name1</a>
    <a href="preview.php?link=http://www.example1.com" class="child_two">preview</a>
</div>
<div class="parent">
    <a href="http://www.example2.com" class="child">name2</a>
    <a href="preview.php?link=http://www.example2.com" class="child_two">preview</a>
</div>
<div class="parent">
    <a href="http://www.example3.com" class="child">name3</a>
    <a href="preview.php?link=http://www.example3.com" class="child_two">preview</a>
</div>
<div class="parent">
    <a href="http://www.example4.com" class="child">name4</a>
    <a href="preview.php?link=http://www.example4.com" class="child_two">preview</a>
</div>
<div class="parent">
    <a href="http://www.example5.com" class="child">name5</a>
    <a href="preview.php?link=http://www.example5.com" class="child_two">preview</a>
</div>

太感谢了。

4

3 回答 3

1 
$("a.child").each(function (index, elem) { 
    $(elem).clone()
        .attr("href", "preview.php?link=" + $(elem).attr("href")).attr("class", "child_two").text("preview").appendTo($(elem).parent());
});​
于 2012-12-21T22:24:44.877 回答
0 
$("a.child").each(function(){
    var newLink = $(this).clone();
    $(newLink).attr("href", "preview.php?link=" + $(this).attr("href"));
    $(newLink).attr("class", "child_two");
    $(newLink).text("Preview");
    $(newLink).insertAfter(this);
});

http://jsfiddle.net/bkU4r/2/

已更新 - 我没有注意到您希望第二个链接阅读“预览”

于 2012-12-21T22:34:56.600 回答
0

您可以使用 after() 的函数来完成

$('.parent a.child').after(function() {
    var $el = $(this);
    return $el.clone().attr({
        'href': 'preview.php?link=' + $el.attr('href'),
        'class': 'child_two'
    }).text('preview');
});​

http://jsfiddle.net/3MFEu/

于 2012-12-21T22:32:35.153 回答