jquery 按属性名称选择每个此值附加文本

Posted 2023-05-09

【中文标题】jquery 按属性名称选择每个此值附加文本

【英文标题】：jquery select by attribute name each this value pepend text

【发布时间】：2014-08-31 09:50:28

【问题描述】：

通过某个属性名称选择元素，在本例中为“图标”：

<a href="#" icon="one.png">link</a>
<a href="#" icon="two.png">link</a>
<a href="#" icon="three.png">link</a>

然后在每个元素前面加上一个 <span> 与元素属性值的文本， 示例：

<span>one.png</span><a href="#" icon="one.png">link</a>
<span>two.png</span><a href="#" icon="two.png">link</a>
<span>three.png</span><a href="#" icon="three.png">link</a>

怎么做？

【问题讨论】：

你试过什么？？？

【参考方案1】：

尝试使用.before() 和接收器功能来完成您的任务，

$('a[icon]').before(function()
  return $("<span>", text: $(this).attr('icon'));
)

DEMO

【参考方案2】：

试试这个：

$('a[icon]').each(function()
   $(this).before('<span>'+$(this).attr('icon')+'</span>');
);

Demo

【参考方案3】：

试试这个方法

$('a[icon]').each(function()
   $(this).before('<span>'+$(this).attr('icon')+'</span>') 
);

DEMO

【参考方案4】：

试试这个：

$('a[icon]').each(function()
   $('<span />',  text : this.getAttribute('icon') ).insertBefore(this);
);

【讨论】：

@downvoter 注意评论，这是一个新手错误，使用.before() 方法必须是.insertBefore()。已更新。