在单独的元素中更改 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 的任何自定义 URL 都应保留其自定义文本，但要检索工具提示。
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

使用 tooltip 和 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

Answer 2

你必须循环所有的链接，像这样：

$("a.wowrename").each(function() {
    // some code
});

Answer 3

这是一个简单的解决方案。这不是最好的方法。

var wowhead_tooltips = { "colorlinks": true, "iconizelinks": true, "renamelinks": true }
$('a').hover(function() {
  if ($(this).hasClass('wowrename') {
    wowhead_tooltips.renamelinks = true;
  }
  else {
    wowhead_tooltips.renamelinks = false;
  }
});

我不知道 wowhead API 究竟是如何工作的，但如果 wowhead_tooltips 变量恰好在用户用鼠标指向链接的那一刻加载（没有任何超时） - 这可能会失败或随机工作/不工作。 原因可能是 javascript 不知道先执行哪个函数。

我希望这会奏效。如果不是 - 评论我会考虑另一种方式。