javascript - 修改dom节点属性，并保存这段HTML

Question

var template = $(this).parent().next().html()
console.log(template)

chrome 控制台输出

<a href="/weishiji/objActivity/timeline/746"><img class="my-pic-head" width="40" height="40" original="/weishiji/avatar/20130121/746.jpg" style="display: block;" src="/weishiji/avatar/20130121/746.jpg"></a>
        <p class="co_reply">
            <a class="co_reply_name" href="/weishiji/objActivity/timeline/746">test</a>
            7                <br>
            <abbr title="2013-01-26 11:11:11" class="publishfooter">56 minute</abbr>
        </p>
        <pre class="delete_reply" id="comment-542">delete</pre>

现在我使用以下代码来修改此 html 中的一些属性。

$(template).find('img').attr('src', 'a')
console.log($(template).html())

chrome 控制台输出

<img class="my-pic-head" width="40" height="40" original="/weishiji/avatar/20130121/746.jpg" style="display: block;" src="/weishiji/avatar/20130121/746.jpg">

但这不是我想要的结果，没有改变img src属性值，并且扔掉了其他节点我只想改变里面的属性

Answer 1

我认为你的问题是你将模板设置为等于 html() 与将其设置为实际对象。试试这个:

var template = $(this).parent().next();
$(template).find('img').attr('src', 'a');

希望这有帮助。这是一些示例 fiddle看看它的工作原理。

正如 @AustinBrunkhorst 指出的，这同样有效:

template.find('img').attr('src', 'a');

祝你好运。