将图像属性更改为 <li>示例标题</>

Posted 2023-05-07

【中文标题】将图像属性更改为 <li>示例标题</>

【英文标题】：Change image Attr alt, to <li>sample title</>

【发布时间】：2012-12-02 13:03:27

【问题描述】：

我有一个 JS _buildPlaylist 文件，例如：

//创建拇指 thumb=$(new Image()).addClass('thumb_img').appendTo(div).attr('alt', _item.title?_item.title:'').css( 光标：'指针'， 不透明度：0 ).load(函数() $(this).stop().animate( 'opacity':1, duration: 500, easing: 'easeOutSine');//fade in thumb ).错误（函数（e） ).attr('src', _item.thumbnail);

带有“alt title name”的图像缩略图行

这是结果：

 <img class="thumb_img"  style="cursor: pointer; opacity: 1;" src="http://mywebsite.com/image.jpg">

---

如您所见，这会创建一个带有 alt 文本属性的图像

现在，我想改建一个

List names 此处构建的示例标题（这是 ALT 标题名称）

那么，如何将图像缩略图更改为文本，或仅显示 alt 标题？

【参考方案1】：

如果您不想显示图像，则不需要使用img 标签。 只需将其作为label 或link 即可。这样就可以了。

【参考方案2】：

与其构建 new Image()，不如构建一个包裹在 <li> 中的 <a>：

var thumb = $("<a>",  
    'class': 'thumb_item', 
    'text' : (_item.title ? _item.title : "No title"),
    'href' : _item.thumbnail
).wrap("<li>").parent().appendTo(div);​

当然，我们会取消 .load 和 .error 处理程序，因为这些事件不会发生在列表项上。

小提琴：http://jsfiddle.net/tudwA/