Question

HTML看起来像这样：

<body>
    <ul>
        <li class='link'> <a href='http://www.1.com'></a></li>           
    </ul>

    <ul>
        <li class='link'> <a href='http://www.2.com'></a></li>              
    </ul>
</body>

js：

$(document).ready(function(){

    $(".link a").each(function() {
        var a_href = $(this).attr('href');
        var parser = document.createElement('a');
        parser.href = a_href;

        if (parser.hostname == "www.1.com") {
            $(this).append('<img src="1.jpg"/>');
        } else if (parser.hostname == "www.2.com") {
            $(this).append('<img src="2.jpg" />');
        } 
    });

    $('body').append("<ul><li class='link'><a href='http://www.2.com'></a></li></ul>");
});

我希望附加的标签也反映插入。

这里我简化了我的情况，实际上，附加是通过点击添加的，所以我想确保即使稍后添加也可以插入。

Answer 1

如果我理解正确，我认为您希望在主体上附加一个.on（）来侦听新附加的标签，以便您可以对其中的任何标签进行插入。

根据您对我的评论的回复，我认为您将不得不在点击处理程序中执行此操作...

$('selector').click(function(e){
  // add your new ul here
  // call imagify to add <img> to <a>
  imagify(e);
});

function imagify(e) {
  $(".link a").each(function() {
        if ($(this).find('img').length == 0) {
            var a_href = $(this).attr('href');
            var parser = document.createElement('a');
            parser.href = a_href;

            if (parser.hostname == "www.1.com") {
                $(this).append('<img src="1.jpg"/>');
            } else if (parser.hostname == "www.2.com") {
                $(this).append('<img src="2.jpg" />');
            }
        }
    });
}

Answer 2

切换它并使用.appendTo()，以便.on()可以正确链接：

$("<ul><li class='link'><a href='http://www.2.com'></a></li></ul>").appendTo('body').on(/*...*/);

如何在jquery中'on'使用'on'？

2 个答案: