Javascript 创建网页插件。如何包含css和渲染元素？

我想创建一个网页插件（不是jQuery插件），网站管理员可以通过将几行代码粘贴到HTML中来安装它

例如：

<script src=".../plugin.js" />
<script>window.plugin(parent_element, {some: "config"});</script>

plugin（父元素，{some:“config”}）；

Discus这样做：

<div id="disqus_thread"></div>
<script type="text/javascript">
    /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
    var disqus_shortname = 'asdasdsadad'; // required: replace example with your forum shortname

    /* * * DON'T EDIT BELOW THIS LINE * * */
    (function() {
        var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
        dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
    })();
</script>
<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>

/***配置变量：粘贴到网页前编辑***/
var discus_shortname='asdasdsadad'；//必需：将示例替换为论坛短名称
/***请勿在此行下方编辑***/
（功能（）{
var dsq=document.createElement（'script'）；dsq.type='text/javascript'；dsq.async=true；
dsq.src='/'+discus_shortname+'.discus.com/embed.js'；
（document.getElementsByTagName（'head'）[0]| | document.getElementsByTagName（'body'）[0]）.appendChild（dsq）；
})();
请启用JavaScript以查看

（我不确定为什么Disqs需要运行Javascript来将Javascript添加到标题中。）

该插件将创建一个新的html元素，并要求该元素使用css

我使用它来避免对jQuery的依赖

我只针对IE9+、FF和Chrome

从

标记加载css的常见做法是什么

（我真的希望网站管理员能够覆盖插件的css，为其设置样式。）

---

生成html的最佳方法是什么？元素、原始字符串、函数或某种形式的模板库？

插件创建者希望从主体内部将js添加到

头部的最可能原因是为了确保任何人（即使那些不一定有权访问
头部的人）都可以使用插件

如果你想覆盖现有的CSS指令，你需要做的就是确保你的指令排在最后。考虑到您正在重写，有时您可能不得不使用
！重要
但这实际上取决于特定元素的所谓特异性。您可以在此处阅读更多关于此的信息：

编辑：正如@Yousef_Shamshoum在对原始问题的评论中指出的，这里有一个SO问题，它回答了如何使用JavaScript添加CSS文件的问题（即“从
标记加载CSS”）：
我认为您可以使用这个：