如何隐藏没有 src 属性的 img 元素，直到添加属性？答案

【问题标题】：How to hide img elements that do not have src attribute, until the attribute is added?如何隐藏没有 src 属性的 img 元素，直到添加属性？
【发布时间】：2010-10-09 19:01:36
【问题描述】：

我的 JS 代码包含一些开头为空的图像（完全没有指定 src 属性 + display:none）。

当添加到具有 CSS1 兼容性的网站时，我看到图像应该在的位置损坏的图像图标，即使 图像不应该显示（显示：无）。

知道如何隐藏损坏的图像图标吗？

注意事项：我不想加载空图像。我试过 width 和 height= 1px 或 0px 。没用。指定 src="" 也会给出空图像图标。

编辑：我找到了解决方案：将 style="display:none" 添加到 img 定义（不在 CSS 中）

【问题讨论】：

标签： javascript image src

【解决方案1】：

您是否尝试过将图像包装在 div 中并隐藏 div？

【讨论】：

【解决方案2】：

当需要显示图像时，仅使用一个占位符 div 标签并用图像替换它怎么样？任何像样的 ajax 框架（例如 jQuery）都会让这变得容易，因此它适用于所有主要浏览器

【讨论】：

【解决方案3】：

如果您使用的是 JavaScript 库，则可能值得为所有这些图像应用一个类来命名并让库来处理它。使用类名 myImages 的原型示例将是

var images = $$('.myImages');

if (image != null)
{
    for (int i = 0; i < images.Length; i++)
    {
        images[i].hide;
    }
}

您仍然需要添加样式属性 style="display: none;"到图片

【讨论】：

感谢您的回答。我没有使用图书馆。

【解决方案4】：

除了显示：无，也许可以尝试设置可见性：隐藏

【讨论】：

【解决方案5】：

我的 JS 代码包含一些开头为空的图片（没有指定 src 属性

这不是图像的有效状态。最好使用占位符透明图像或将图像保留在 DOM 之外，直到您可以设置“真实”的 src 属性。

我看到损坏的图像图标，即使图像不应该显示（显示：无）。

对我来说不会发生，“显示：无”或“可见性：隐藏”会从页面中删除可见图像。演示问题的示例代码，以及哪些浏览器？

【讨论】：

差异的原因是它所连接的站点是CSS1兼容模式。
如果您在谈论 document.compatMode='CSS1Compat'，那是完全正常的标准模式。但是你声称的行为不应该也不会发生在我身上，无论是在标准模式还是怪癖模式下。我认为正在发生一些不同的事情，但我们不会在没有代码的情况下找到答案。

【解决方案6】：

解决方法很简单：

将 style="display:none" 添加到 img 定义（不在 CSS 中）

【讨论】：