你可以使用自定义html在页面上替换自己的javascript函数吗？

我有一些JavaScript会在页面上创建某种小部件。我会把这个片段给客户，所以我希望他们不得不做很少的事情。你可以使用自定义html在页面上替换自己的javascript函数吗？

最明显的解决方案，我有工作，现在看起来是这样的：

<div id="divContent"></div> 
<script type="text/javascript"> 
    MakeWidget('divContent'); 
</script>

制作插件基本上看起来为divContent DIV和我的小部件的HTML填充它。

有没有更好的方法来做到这一点？你可以使用脚本标记中的Javascript替换一个脚本标记吗？

我真的很喜欢它，如果我可以减少代码只有MakeWidget函数，它会替换自己和脚本标记与功能生成的HTML。

编辑 - 我基本上想要在页面上调用MakeWidget函数的地方生成HTML。

来源

2010-09-17 Vyrotek

什么是*奇怪的问题...... – 2010-09-17 21:00:51

@JoshStodola并不像看起来那么奇怪，因为这个目标消除了对唯一ID的需求。 – lispmachine 2013-08-23 10:52:26

Can you replace a Script Tag with a Div using Javascript in that Script Tag?

是的。当到达<script>元素时，假设它不是defer或async脚本，它将成为页面中最后一个脚本元素。因此可以这样说，无论是在线还是在外部脚本：

<script type="text/javascript"> 
    (function() { 
     var scripts= document.getElementsByTagName('script'); 
     var script= scripts[scripts.length-1]; 
     var div= document.createElement('div'); 
     div.innerHTML= 'Whatever content is going to be inserted'; 
     script.parentNode.insertBefore(div, script); 
    })(); 
</script>

来源

2010-09-17 20:40:34 bobince

TypeError：脚本是'undefined'第4行:) – Sinan 2010-09-17 20:55:27

gah手指...... – bobince 2010-09-18 02:18:17

您必须在某处定义MakeWidget，对不对？据推测这将在外部脚本。为什么不只是使用window.onload方法将外部脚本源自身附加到divContent？

这将导致您的客户端的网页上这样的代码：

 
<script src="http://foo.com/makewidget.js"></script>

你makewidget.js代码，那么看起来是这样的：

window.onload = function() { MakeWidget('divContent') }

有可能的一些问题与其他脚本加载，可能有一些跨浏览器兼容性问题，但这应该让你指出正确的方向。

来源

2010-09-17 19:49:11

这就是我想摆脱要求一个具体的分裂。我想要在执行javascript时精确地生成HTML。 – Vyrotek 2010-09-17 19:53:12

-1

所以你想有一个脚本元素，用div替换自己。

您最初的代码是这样的：

<div id="divContent"></div> 
<script> 
MakeWidget('divContent'); 
</script>

你可以把它改写这样的（我使用JQuery）：

<script id="scriptContent"> 
    $('#scriptContent').after('<div id="divContent"></div>'); 
    MakeWidget('divContent'); 
    $('#scriptContent').remove(); 
</script>

我还没有尝试过，但！

来源

2010-09-17 20:17:58

-1

我认为这将有可能做到这一点，如下所示：

<div id="divWidgets"> 
    <script type="text/javascript"> 
     MakeWidgets("divWidgets"); 
    </script> 
</div>

最终的结果应该是（如果我没有理解你的描述正确），MakeWidgets将替换DIV的内容，在这种情况下，它是脚本本身。

来源

2010-09-17 20:51:06

你可以使用自定义html在页面上替换自己的javascript函数吗？

回答

相关问题