在title属性中不能使用HTML实体吗？ [英] Is it not possible to use HTML entities in a title attribute?

问题描述

上面的screengrab是来自Firefox。光标悬停在图像左侧的黄色点上。它是一个< img> 元素（实际上它是一个图像和包含单个圆形< area> 元素，但我认为这种区别并不重要），它是用JavaScript创建和设计的，包括应用title属性（通过剪切和粘贴字符串构造）。我怎样才能得到这样的表现，并显示出预期的人物，而不是& ndash; ？它适用于innerHTML（中间左上角的文本Barrow-In-Furness是一个也是使用JavaScript创建的div，以及它的innerHTML集合。）

编辑：回复Domenic的问题：下面是构建和应用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 + =（你可以买这个+ LinkAltTextDescription +）; 
} else {
 EltI.src = ImagePath +icon-buylink-no.png; 
 AltText + =（你不能买这个+ LinkAltTextDescription; 
 AltText + = CanBuyLinkCode === 1？
，因为你没有连接到它）：
，因为你必须从Demand Track购买煤炭，而且你不能这么做）; （LinkStatus [LinkNumber] === 8 || 
（LinkStatus [LinkNumber]> = 0&& LinkStatus [LinkNumber]< = 4）$（
）
} b $ b）{
 EltI.src = ImagePath +i+ LinkStatus [LinkNumber] +.png; 
 if（LinkStatus [LinkNumber] === 8）{
 AltText + =（orphan+ LinkAltTextDescription +）; 
} else {
 AltText + =（+ 
 LinkAltTextDescription + 
拥有者+ 
 PersonReference（LinkStatus [LinkNumber]）+ 
 ）; 
} 
}其他{
抛出意外的链接状态; 
} 
 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，
 ，曼彻斯特，米德兰兹，诺​​斯维奇，
奥德姆，普雷斯顿，罗奇代尔，苏格兰，
绍斯波特，斯托克波特 ; amp; Runcorn，Wigan，
Yorkshire
]; 
  

解决方案

您没有设置标题属性 ，你要设置标题属性，它需要文本而不是HTML（尽管 setAttribute 方法也需要一个文本字符串）。

一般来说，在处理DOM操作时，您提供的是文本而不是HTML。 .innerHTML 是这个规则的显着例外。

The above screengrab is from Firefox. The cursor is hovering over the yellow spot at the left hand side of the image. It is an <img> element (well actually it's an image together with an image map containing a single circular <area> element, but I assume this distinction is unimportant) that has been created and styled in JavaScript, including the application of a title attribute (constructed by cutting and gluing strings). How can I get this to behave and show the intended character, an en dash, instead of –? It works for innerHTML (the text "Barrow-In-Furness" in the top middle-left is a div that was also created using JavaScript, and its innerHTML set.)

Edit: In response to question of Domenic: Here is the JavaScript function that builds and applies the title attribute (in addition to performing other jobs):

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 is as follows:

var LocationName = [
    "Barrow–In–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 & Runcorn",     "Wigan",
                        "Yorkshire"
];

解决方案

You aren't setting the title attribute, you are setting the title property, which expects text and not HTML (although the setAttribute method also expects a text string).

Generally speaking, when dealing with DOM manipulation, you provide text and not HTML. .innerHTML is the notable exception to this rule.

这篇关于在title属性中不能使用HTML实体吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！