使用JavaScript和锚标记将IMG标记插入DOM

Question

目前我有以下JavaScript函数将IMG标记插入DOM：

function createHeaderImageRight() {
    var parentElement = $("#sidebar");

    var img1 = $('<img />', {
        id: 'headerImageLeft',
        src: '/Images/Header/FGM2.jpg',
        "class": 'img-responsive headerImageLeft',
        alt: ''
    });
    img1.appendTo(parentElement);
}

我想修改它以包含锚标记，以便在单击图像时，我们可以将用户带到URL。我不知道如何修改此代码以包含我需要的标记。

Answer 1

为什么你不能这样做..

$("#sidebar").append('<a href="urlToBeRedirected"><img id="headerImageLeft" src="/Images/Header/FGM2.jpg" class="img-responsive headerImageLeft"/></a>');

Answer 2

您可以使用与img标记相同的技术。

var a1 = $('<a />', 
    { id: 'headerImageLeftLink',
      href: 'http://somewebsite.com'
    });
img1.appendTo(a1);
a1.appendTo(parentElement);

或者，您可以将附加链接起来：

parentElement.append(a1).append(img1);