jQuery 前置图像

Posted 2023-04-13

【中文标题】jQuery 前置图像

【英文标题】：jQuery Prepend an Image

【发布时间】：2010-03-09 09:27:24

【问题描述】：

我正在尝试添加图像的前置，然后定义它的属性。对如何做到这一点有点困惑 - 目前我有以下内容，但它不起作用。 html是

<div id="testID" class="test1">
        <div id="testID2" class="test2" ></div>
    </div>

JS 是

var test123 = somecode
jQuery(test123).find('#testID2').prepend('<img />').attr(
   src: 'some src.gif',
   alt: '',
   height: '60'
);

我希望实现

<div id="testID" class="test1">
  <div id="testID2" class="test2" >
      <img src='some src.gif' alt='' height='60' />
  </div>
</div>

有什么想法吗？

【参考方案1】：

应该是：

jQuery("<img/>").prependTo("#testID2").attr(
   src: 'some src.gif',
   alt: '',
   height: '60'
);

因为在您之前的代码中，您将属性附加到容器而不是 img 标签

【讨论】：

调试这种东西firebug真的很有用，你可以在firebug中看到什么被添加到哪里。

嘿，非常感谢 - 只是想知道我是否有一个“发现”在那里它是如何工作的？我已经更新了问题

好吧，#testID2 不需要 find()，但 prependTo() 的参数很容易是 jQuery(test123).find('#testID2') 而不仅仅是 "#testID2"

是的，没错。但是对于更复杂的表达式，我建议您将代码分解为多行/表达式。 var some_img = $("").attr(...); $(test123).find("#testID2").prepend(some_img);

【参考方案2】：

Engwan 的回答是实现您想要的简单方法。这只是一个替代示例，其中在将 <img> 标记插入 DOM 之前设置属性：

jQuery(test123).find('#testID2').prepend(
  $('<img />').attr(
   'src': 'some src.gif',
   'alt': '', 
   'height': '60'
  )
);