javascript - 更改单独元素中的 javascript 变量

Question

我运行一个基于 php (phpbb)、javascript 和 html 的 WoW 公会论坛。长期以来，Wowhead 允许将链接发布到其元素/法术 ID 等。Wowhead JS 及其变量的基本代码是:

<script src="//static.wowhead.com/widgets/power.js"></script>
<script>var wowhead_tooltips = { "colorlinks": true, "iconizelinks": true, "renamelinks": true }</script>

有一个扩展可以通过 HTML 文件将此代码放入每个页面的页脚中。发布的每个 Wowhead 链接都将转换为链接，并带有解释其链接内容的工具提示。 wowhead_tooltips 变量的 '"renamelink": true' 部分使得项目或咒语的任何链接都被重命名为其所链接内容的确切名称。

问题:当我使用 Wowhead 链接生成自定义 URL 时，即:

<a href="http://www.wowhead.com/spell=1953">Teleport</a>

它不会使用 Blink 工具提示显示“Teleport”，而是将整个 URL 重命名为带有图标的 Blink，如 wowhead_tooltips 变量中所述。

我想要实现的是:

1. 任何指向 Wowhead 的直接 URL 都应转换为重命名的咒语/元素。
2. Wowhead 的任何自定义网址都应保留其自定义文本，但检索工具提示。
3. 这两者都应该可以在一个页面上实现。

我想出的最佳解决方案是根据类向 var wowhead_tooltips 添加一个“if”函数，然后将类添加到 URL:

<script>if ($('a').hasClass("wowrename")) { var wowhead_tooltips = { "colorlinks": true, "iconizelinks": true, "renamelinks": false } }</script>
<a class="wowrename" href="http://www.wowhead.com/spell=1953">Teleport</a>

这可行，但是，此解决方案的问题是，一旦脚本识别出页面上带有“wowrename”类的 URL，它将停止重命名所有链接，这意味着自定义 URL 和直接 URL 不能混合使用单个页面。

我尝试过的任何其他解决方案，例如使用 ID、定义不同的变量等，要么不起作用，要么会产生相同的限制。

因此问题是，是否可以根据 id、class 或其他任何内容更改每个元素 (URL) 的 Javascript 变量(在本例中为“var wowhead_tooltips { “renamelinks”: false}”？)

Answer 1

使用工具提示和 iccn 重命名的直接链接。

<a href="http://www.wowhead.com/spell=1953">Teleport</a>

带有工具提示和原始文本的自定义链接。我已将原始链接文本存储为数据属性，以便我们可以在更改后恢复它。

<a class="wowrename" href="http://www.wowhead.com/spell=1953" data-value="Teleport">Teleport</a>

继续检查static.wowhead.com/widgets/power.js何时更改最后一个链接文本。更改后，使用 data-value 值进行恢复，删除添加的用于创建图标的样式并停止计时器。

$(function () {
    //timmer
    checkChanged = setInterval(function () {
        // check for when the last link text has changed
        var lastItem = $("a.wowrenameoff").last();
        if (lastItem.text() !== lastItem.data('value')) {
            $("a.wowrenameoff").each(function () {
                //change value
                $(this).text($(this).data('value'));
                //remove icon
                $(this).attr('style', '');

                //stop timer
                clearInterval(checkChanged);
            });
        }

        i++;
    }, 100);
});

这确实会导致链接图标闪烁，但在页面刷新后会重复出现。

JSFiddle demo