Question

如何始终在HTML中显示锚标记的alt属性？

这是我有多个重复网格的情况，我想用日期来识别所以我想总是展示标题，我怎样才能做到这一点？

<a href="#" title="created at 12 october">see details</a>
<a href="#" title="created at 13 october">see details</a>
<a href="#" title="created at 14 october">see details</a>

以下是演示：https://jsfiddle.net/wub5y96d/1/

Answer 1

您可以在伪元素content: attr(attribute);或::after上使用::before输出元素属性的内容，如下所示：

a[title]::after {
  content: ' ('attr(title)')';
}

Demo

Answer 2

尝试这个简单的循环

$('a').each(function(){
 var text = $(this).text();
 var title = $(this).attr('title');
 $(this).text(text+'-'+title);
});

Answer 3

为什么人们继续使用小提琴。当Snippets工作正常时......：）

你可以直接在SO里面运行它们，这有多酷。哦，也许这只是我......

a::after {
  position: absolute;  
  top: 16px;
  left: 0px;
  width: 200px;
  color: silver;
  content: attr(data-created);
  font-size: smaller;
}
a {
  position:relative;
  display:inline-block;
  height: 30px;
}

<div>
   <a href="#" data-created="created at 12 october">see details</a>
</div>
<div>
   <a href="#" data-created="created at 15 october">see details</a>
</div>

如何始终显示锚标记的alt属性

3 个答案: