如何将 URL 添加到 Chrome 浏览器扩展程序？答案

【问题标题】：How to add a URL to a Chrome Browser Extension?如何将 URL 添加到 Chrome 浏览器扩展程序？
【发布时间】：2015-10-06 17:21:00
【问题描述】：

我创建了一个Chrome 浏览器扩展。我已将 HTML Table 作为 Popup 添加到 browser_action.html，如下所示。

我想要的是，当我点击一个表格单元格时，它应该将我带到一个链接。单击不同单元格时的不同链接。

这是我的代码的一部分：

<tr>
<td class="tg-z3w6 hvr-underline-from-center"><a href="http://ew/Environment/Detail?envid=2715"></a>TEST</td>
<td class="tg-ges6">2715</td>
</tr>

但它不起作用。知道为什么吗？或解决此问题的方法？

【问题讨论】：

您希望链接在 popup.html 中还是在 chrome tab 中打开？

标签： html google-chrome google-chrome-extension google-chrome-devtools browser-extension

【解决方案1】：

TEST 应介于 <a> 和 </a> 之间。

【讨论】：

我试过了，网址也是“可点击的”，但还不行。

【解决方案2】：

在你的 popup.html 中假设你使用的是 jquery-

$(document).ready(function(){
   $('body').on('click', 'a', function(){
     chrome.tabs.create({url: $(this).attr('href')});
     return false;
   });
});

【讨论】：

谢谢 :) 我实际上无法让它工作，所以我在没有 jQuery 的情况下做到了

【解决方案3】：

这是我自己的问题的解决方案。创建popup.js并在页面中链接：

<script src="popup.js" ></script>

将以下代码添加到popup.js：

document.addEventListener('DOMContentLoaded', function () {
    var links = document.getElementsByTagName("a");
    for (var i = 0; i < links.length; i++) {
        (function () {
            var ln = links[i];
            var location = ln.href;
            ln.onclick = function () {
                chrome.tabs.create({active: true, url: location});
            };
        })();
    }
});

就是这样，之后链接应该可以工作了。

【讨论】：

这就像一个魅力！谢谢

【解决方案4】：

这很简单，您只需将target="#" 添加到您的 a 标签即可

喜欢

<td class="tg-z3w6 hvr-underline-from-center"><a href="http://ew/Environment/Detail?envid=2715" target="#" ></a>TEST</td>

【讨论】：

抛开这是否可以在扩展程序中工作，target="#" 对于任何网页来说都不是一个好主意。您想使用target="_blank" 或使您的目标名称成为一些语义上有意义的名称。见here。