如果div没有img标签，请向div中添加一个“无图像” img（Javascript或Jquery）

Question

如果div元素还没有img标签，我想在div元素前添加img标签。 最佳使用方法是什么？ 我想在javascript和jquery中都看到答案，这样可以帮助我学习，但是任何一个都可以。

我已经使用.not（）和.empty（）进行了几次jquery尝试，但我觉得我没有正确考虑它。

Answer 1

尝试这个：

if($('#your_div').find('img').length==0){
   $('#your_div').prepend('<img src="img/your_image.jpg" />');
}

演示

Answer 2

纯Javascript不如JQuery优雅

var imgexists = false;
for (var i = 0; i < mydiv.children.length; i++) {
    if (mydiv.children[i].tagName.toLowerCase() == "img") {
        imgexists = true;
        break;
    };
};

if (!imgexists) {
    var img = document.createElement("img");
    img.src = "some/path.png";
    if (mydiv.children.length > 0) {
        mydiv.appendChild(img, mydiv.firstChild);
    } else {
        mydiv.appendChild(img);
    };
};

Answer 3

好的，您有很棒的jQuery解决方案，因此我将提出纯JS版本：

var div = document.getElementById('div');

if (!div.querySelector('img')) {
    var img = document.createElement('img');
    img.src = 'image.png';
    div.insertBefore(img, div.firstChild);
}

测试： http ： //jsfiddle.net/9V2HR/

如您所见，在这种情况下，香草JS几乎与jQuery代码一样短。

Answer 4

if ($("#myId img").length === 0) {
    $("#myId").append("<img src=\"https://www.google.com/images/srpr/logo4w.png\" />");
}

使用jQuery长度

不要为纯JavaScript解决方案而烦恼-它会不必要地变得复杂，并且可能会导致跨浏览器不兼容

Answer 5

使用length并find img标签...是在前面..没有其他材料

使用jQuery

if($('#divID').find('img').length > 0) {
   //img present so do other stuff 
}else{
   var img=$('<img />',{src:"imgsrc.jpg"});
  $('#divID').prepend(img)
};