2011-05-04 25 views
6

在title屬性中不可能使用HTML實體嗎?

上面的屏幕截圖來自Firefox。光標懸停在圖像左側的黃色點上。它是一個<img>元素(實際上它是一個包含單個圓形元素的圖像映像,但我認爲這種區別並不重要),它是用JavaScript創建和設計的,其中包括應用title屬性(由切割和粘合琴絃)。我怎麼能得到這個行爲,並顯示預期的性格,而不是&ndash;?它適用於innerHTML(中間左上角的文本「Barrow-In-Furness」是一個也是使用JavaScript創建的div,以及它的innerHTML集)。

編輯:回覆Domenic問題:Here是建立和應用title屬性(除執行其他任務)的JavaScript函數:

var StyleLinkMarker = function (LinkNumber, EltA, EltI) { 
    var AltText = LocationName[LinkStart[LinkNumber]] + 
        " to " + 
        LocationName[LinkEnd[LinkNumber]]; 
    if (!EltA) { 
     EltA = document.getElementById("link_marker_area" + LinkNumber); 
     EltI = document.getElementById("link_marker_img" + LinkNumber); 
    } 
    if (LinkStatus[LinkNumber] === 9) { 
     var CanBuyLinkCode = BoardPreviewMode ? 0 : CanBuyLink(LinkNumber); 
     if (CanBuyLinkCode === 0) { 
      EltI.src = ImagePath + "icon-buylink-yes.png"; 
      AltText += " (you can buy this " + LinkAltTextDescription + ")"; 
     } else { 
      EltI.src = ImagePath + "icon-buylink-no.png"; 
      AltText += " (you cannot buy this " + LinkAltTextDescription; 
      AltText += CanBuyLinkCode === 1 ? 
         ", because you aren't connected to it)" : 
         ", because you would have to buy coal from the Demand Track, and you can't afford to do that)"; 
     } 
    } else if (LinkStatus[LinkNumber] === 8 || 
       (LinkStatus[LinkNumber] >= 0 && LinkStatus[LinkNumber] <= 4) 
       ) { 
     EltI.src = ImagePath + "i" + LinkStatus[LinkNumber] + ".png"; 
     if (LinkStatus[LinkNumber] === 8) { 
      AltText += " (orphan " + LinkAltTextDescription + ")"; 
     } else { 
      AltText += " (" + 
         LinkAltTextDescription + 
         " owned by " + 
         PersonReference(LinkStatus[LinkNumber]) + 
         ")"; 
     } 
    } else { 
     throw "Unexpected Link Status"; 
    } 
    EltA.alt = AltText; 
    EltA.title = AltText; 
}; 

LocationName如下:

var LocationName = [ 
    "Barrow&ndash;In&ndash;Furness", "Birkenhead",    "Blackburn", "Blackpool", 
          "Bolton", "Burnley",      "Bury",  "Colne", 
        "Ellesmere Port", "Fleetwood",    "Lancaster", "Liverpool", 
        "Macclesfield", "Manchester",    "The Midlands", "Northwich", 
          "Oldham", "Preston",     "Rochdale", "Scotland", 
         "Southport", "Stockport", "Warrington &amp; Runcorn",  "Wigan", 
         "Yorkshire" 
]; 
+1

你確定'–'不編碼兩次像:'& - ' – Mark 2011-05-04 21:45:15

+0

你是如何設置title屬性的?以下工作正常:' test me' – Domenic 2011-05-04 21:45:51

+0

@Mark:我確信它不是雙重編碼的。特別是,如果它是雙重編碼的,我應該期望圖像頂部中間左側的大膽的Verdana文本也可以從字面上顯示HTML實體,而不是正確顯示預期的字符。這是因爲div的內容是由相同的JavaScript字符串創建的。 – Hammerite 2011-05-04 22:01:27

回答

5

您沒有設置標題屬性,你是 設置標題屬性,期望文本而不是HTML(儘管setAttribute方法也期望一個文本字符串)。

一般來說,在處理DOM操作時,您提供的是文本而不是HTML。 .innerHTML是此規則的顯着例外。

+0

我明白了。我如何設置標題屬性? – Hammerite 2011-05-04 22:16:14

+0

通過爆炸父元素的全部內容並使用innerHTML替換它。這不是一個好主意。以文本格式而不是HTML格式獲取數據。 (你可以,儘管我不推薦它作爲一種方法,但是設置'span'的'innerHTML',然後讀取'textNode'的'data',它將是該元素的'firstChild' ......但是它最好從源代碼獲取沒有HTML編碼的數據) – Quentin 2011-05-04 22:18:40

+0

我能夠通過使用UTF-8文本而不是HTML來使其工作。我曾經期望位置名稱的其他元素之一中的字面符號會導致頁面無法驗證,但似乎有些魔術會將其變爲實體。有沒有辦法在JavaScript中的HTML實體之間進行文本轉換?這似乎應該是令人驚訝的。 – Hammerite 2011-05-04 22:48:11

1

下面是從HTML轉換一個簡單的方法來短信:

function convertHtmlToText(value) { 
    var d = document.createElement('div'); 
    d.innerHTML = value; 
    return d.innerText; 
} 

那麼你的代碼可以更新到這一點:

EltA.title = convertHtmlToText(AltText); 
+0

這是一個令人難以置信的實用解決方案,謝謝!遺憾的是沒有原生的方法,但這種方法有一些優點。 – 2014-05-14 10:14:37

相關問題