如何在不發出HTTP請求的情況下在HTML中顯示「密鑰」？

我想在我創建的HTML/JavaScript應用程序中的特定關鍵字旁邊顯示「鑰匙」（來自鑰匙鏈），但我不想讓任何HTTP請求加載圖像。我怎樣才能在所有主流瀏覽器中可靠地做到這一點？如何在不發出HTTP請求的情況下在HTML中顯示「密鑰」？

是否有一個UNICODE值有效？（我找不到）

有沒有Webdings字體的作品？（他們通常不在Opera和Firefox中工作）

有沒有一種方法可以使用由JavaScript提供的字符串提供的base64圖像源在JS中創建圖像？

謝謝！

2012-11-20 John Fowler

這個問題可能對您的creating-幫助圖像與JavaScript的問題：http://stackoverflow.com/questions/1095102/how-do-i-load-binary-image-data-using-javascript-and-xmlhttprequest – Zlatko

相關：http：// stackoverflow .com/questions/1384380/is-there-a-unicode-glyph-that-looks-like-a-key-icon – leonbloy

可以使用base64 data in a image's scr屬性：

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Red dot">

可以再通過與JavaScript的文本掃描，並根據需要添加圖像標記。
（或包裹在一個跨度的文字，圖像設置爲跨度的背景。）

實際創建DOM中的圖像：

var img=document.createElement("img"); 
    img.setAttribute('src', 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38G IAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg=='); 
    img.setAttribute('alt', 'Red dot'); 
    img.setAttribute('height', '10px'); 
    img.setAttribute('width', '10px'); 
document.body.appendChild(img);

編輯：
You can use this tool將圖像編碼爲Base64。

來源

2012-11-20 13:43:22 Cerbrus

添加了base64編碼器鏈接。 – Cerbrus

⚿0x26BF看起來很不錯。我不知道他們把一個正方形內的關鍵，但無論如何...當然，問題是用戶的字體是否有碼點......

enter image description here

來源

2012-11-21 03:28:49 dda

我沒有看到一個鍵 –

我這樣做:-)這就是爲什麼我提到字體問題...... – dda

「Webdings」字體似乎在0xD1有一個老式的鍵。 – Cerbrus

如何在不發出HTTP請求的情況下在HTML中顯示「密鑰」？

回答

相關問題