如何總是顯示錨點標記的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/

來源

2016-10-25 EaB

請辭錨文本會更好 – Satpal

@ Satpal，怎麼可以做 – EaB

@Satpal，在HREF我想包括一些頁面引用 – EaB

可以輸出元素的屬性在任僞元素::after或::before的使用content: attr(attribute);，喜歡的內容這個：

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

Demo

來源

2016-10-25 09:41:21 connexo

爲了完整起見，我想建議在這種情況下使用'：before'，因爲'：before'適合於'10月14日創建 - 看到更多'更好。 – Roberrrt

我真的會根據OP想要渲染屬性內容來決定使用哪一個。如果他希望你的建議，他應該使用':: before'，如果他希望看到像「看到細節（10月3日創建）」，'::之後'是自然的解決方案。 – connexo

@Roberrrt，我即將接受你的回答，但你已經刪除，現在我有很好的選擇，我connexo。 – EaB

試試這個簡單的循環

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

來源

2016-10-25 09:41:14 madalinivascu

爲什麼在這裏使用JavaScript（甚至jQuery）？ – connexo

，因爲他可以:) – madalinivascu

這不是一個爭論。 – Roberrrt

爲什麼人們繼續使用Fiddle's。當片段將工作得很好.. :)

你可以直接在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>

來源

2016-10-25 09:51:22 Keith

如何總是顯示錨點標記的alt屬性

回答

相關問題