Question

是否有必要在src中设置img代码？如果我没有设置此属性，我看不到图像。虽然我设置了属性background-image。如何在没有src标签的情况下创建图像？

function insertLinkHoverImage(datei,datei2,verlinkung) 
{
    var doc = document.getElementById("frame").contentWindow.document;

    var range = doc.getSelection().getRangeAt(0);
    var nnode = doc.createElement("img");
    var alink = doc.createElement("a");
    var classDatei2 = "";

    alink.href = verlinkung;
    classDatei2 = datei.replace(".","-");

                alink.setAttribute("class",classDatei2);

    //nnode.src = 'http://...../cms/uploads/'+datei;
    nnode.setAttribute("styleWithCss",true,null);
    nnode.setAttribute("style","background-image:url(http://..../cms/uploads/"+datei+")");

    alink.appendChild(nnode);
    range.insertNode(alink);

}

Answer 1

W3C网站 - http://www.w3.org/TR/2014/CR-html5-20140429/embedded-content-0.html#the-img-element - 告诉我们：

src属性必须存在，并且必须包含一个有效的非空URL，该URL可能由引用非交互式（可选动画）图像资源的空格包围，该图像资源既不是分页也不是脚本。

上述要求意味着图像可以是静态位图（例如   PNG，GIF，JPEG），单页矢量文档（单页PDF，   带有SVG根元素的XML文件），动画位图（APNG，动画   GIF），动画矢量图形（带有SVG根元素的XML文件）   使用声明性SMIL动画），等等。但是，这些   定义排除带有脚本，多页PDF文件的SVG文件，   交互式MNG文件，HTML文档，纯文本文档等   类推。

如果您想验证代码，请不要忘记alt属性。

Answer 2

所有HTML属性都有特定用途。

如果您使用带有<img>标记的图像，则src是要以编程方式初始或稍后指定的基本属性。

如果要使用背景图像，可能需要指定容器元素的高度和宽度属性。

示例：

<div style="background-image: url({image url here}; height: {height of the background image}; width: {width of the background image}"></div>

如果你使用div，背景将在div的高度可见。

您可以使用width: auto;或width: 100%;占据容器元素的整个宽度，但height: auto;或height: 100%;在所有情况下都不起作用。

请注意，div是一个块元素。如果您使用的跨度超出了设置样式以包含display : block;的范围。

img.src属性是否必要？

2 个答案: