如何使用Chrome扩展程序/插件访问HTML元素?

亚瑟·谢赫(Yasser Shaikh)

我正在尝试使用Chrome插件。我试图<p>在html页面上找到所有标签,并更改这些标签font-family/ size/ color基本上我只是在尝试这个。

这是我到目前为止所做的。

A. manifest.json

{
    "name": "ABC XYZ",
    "description": "La la la...",
    "version": "1",
    "browser_action": {
        "default_title": "ABC",
        "default_icon": {
            "19": "icons/logo.png"
        },
        "default_popup": "mydefault.html"
    },
    "manifest_version": 2
}

B. mydefault.html

<html>

<head>
    <script src="jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $("#do-magic").click(function() {
                // do something here with the page html.
                // change font-family
                $("body").append("test");
            });
        });
    </script>
</head>

<body>
    <span id="do-magic">Start</span>
</body>

</html>

当打包并加载到chrome时,除了在我试图访问页面元素的click事件之外,此方法均有效。

在此处输入图片说明

点击事件不起作用。控制台上也不会打印任何内容。

请指教。

可汗

根据内容安全政策,您不能在Chrome扩展程序中使用内嵌脚本。这就是为什么您的代码无法执行的原因。

您必须将其移动到单独的文件中。这里

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

如何读取当前页面的HTML以访问Chrome扩展程序中的元素?

Javascript-使用Chrome扩展程序访问多个嵌套元素

如何使用Chrome扩展程序popup.html从新的弹出窗口中定位DOM元素

如何从Chrome扩展程序访问主机

如何从Chrome扩展程序中的多个HTML文件访问Chrome存储

获取页面用户的DOM元素的Chrome扩展程序正在访问

从Chrome扩展程序访问iframe中的DOM元素

如何在 Chrome 中安装 Microsoft Edge 扩展程序(插件)

如何通过Chrome扩展程序访问Netflix的HTML5视频标签元数据

如何在Chrome扩展程序中的popup.html中访问iframe

如何在Chrome扩展程序中检查HTML元素是否可编辑

如何调用在Chrome扩展程序的OPTION.html页面中声明的元素?

Chrome扩展程序:是否可以通过扩展程序访问$ 0(选定的控制台元素)?

Chrome扩展程序:访问popup.html的DOM并启用jQuery

在chrome扩展程序中从html访问图标图像

从Chrome扩展程序访问当前HTML页面中的表

从 Chrome 扩展程序访问 Dynamics

Chrome扩展程序访问权限

限制对Chrome扩展程序的访问

从Chrome扩展程序访问API

如何使用JavaScript创建Chrome扩展程序以隐藏或删除页面元素?

使用Chrome扩展程序访问页面对象

启用/禁用扩展程序中的Chrome插件

在Chrome扩展程序中使用聚合物元素

Chrome扩展程序-使用热键单击页面上的元素(按钮)

如何使用Angular 7扩展HTML元素

如何使用fetch在Firefox或chrome网页扩展程序中获取网页的HTML源代码?

使用chrome扩展程序,我将如何阅读页面中的所有HTML并替换特定部分?

如何在注入了Chrome扩展程序的HTML中使用AngularJS?