Chrome扩展程序 - 将以html编写的表格元素添加到页面中

时间:2016-04-05 10:07:33

标签: javascript html google-chrome-extension

我正在编写Chrome扩展程序,我希望能够编写带有html标记的表格元素,并以编程方式将其添加到带有内容脚本的页面。我知道如何向页面添加元素,如:

var myTable = document.createElement("table");
document.getElementById("Container").appendChild(myTable);

我希望能够写出如下内容:

<table> blah blah </table>

并将此元素添加到页面中。 如果可能的话甚至在自己的文件中有这个元素。 (并且我不希望它因为原因而处于不同的框架中)

为什么呢?因为设计这样的元素更加整洁。 提前谢谢!

1 个答案:

答案 0 :(得分:0)

您可以使用jQuery来执行此操作。创建一个manifest.json文件并放入如下内容:

{
"manifest_version": 2,
"name": "PLUGIN_NAME",
"version": "1",
"content_scripts": [
{
    "matches": [
      "http://your.website.com/*"
    ],
    "js": ["jquery.js", "plugin.js"]
  }
]
}

在同一目录下的plugin.js内部放置如下内容:

jQuery(document).ready(function() {
    var element = jQuery('#id-of-div')
    jQuery('<table><tr><td>HEY !</td></tr></table>').appendTo(element )
});

然后下载jquery并放在同一个目录下。