使用包含脚本的长块动态更改div的源/内容

我已经看到很多问题&有关类似问题的答案，但是我没有找到有关此特定情况的答案。使用包含脚本的长块动态更改div的源/内容

我有一个<div>在我动态显示数据到一个图形的网页，它需要JavaScript到<div>（使用dygraph库）。我想实现一个复选框来更改图形代码和代码之间的<div>的内容，以显示实时摄像头连接，这也需要脚本。

我试图与innerHTML和基于实例的jQuery功能我已经找到了，但他们都被称为无脚本内容非常简单的HTML的变化，比较复杂，我发现是如何变化的图片插入<div>内容。我读过<div>不支持src属性，其他论坛说是的，在我的情况下它没有工作。图书馆div-src.js，也不适用于这种情况。

另一个企图是与标签已经工作，但页面不能正常工作，去不稳定，特别是WebSocket连接。 Eclipse会显示一条警告，指出“未知标签”，并且我已阅读过已在HTML5中过时。

我想用jQuery执行此操作，但知道没有成功。

什么是最好的方法动态插入到一个<div>长的HTML代码块与脚本，调用js库？

<input type="radio" name="radiobutton" value="graph" onClick="changeDivContent()"> 
<input type="radio" name="radiobutton" value="video" onClick="changeDivContent()"> 

<div id="graph-video"> 
--- Block with HTML, nesting divs and javascript --- 
</div>

注：使用jQuery我曾尝试使用.load功能：

$("#graph-video").load("video.jsp"); 
$("#graph-video").load("graphic.jsp");

与结果：代码为图形产生故障和WebSocket的接近。

来源

2014-07-13 Alf

最后它工作。感谢下面的评论。我使用“.load（）”函数。方法是从每个jsp文件（视频和图形）中提取所有javascript代码/函数。然后我将JavaScript函数放在一个js文件中，并通过主页面对此文件进行收费。以这种方式运行。 – Alf

试试这个

function changeDivContent() { 
    $('#graph-video').html('<iframe width="420" height="345"src="http://www.youtube.com/embed/XGSy3_Czz8k"></iframe>)'); 
}

或外部HTML文件

$('#graph-video').load('external_file.htm');

来源

2014-07-13 11:21:27 cizzbar

我看到它，你有各种问题的方式。首先是动态加载js文件。为此，您必须将它们添加为DOM对象，而不是内部HTML。为了达到目的，您可以使用此功能：

function loadjscssfile(filename, filetype){ 
if (filetype=="js"){ //if filename is a external JavaScript file 
    var fileref=document.createElement('script') 
    fileref.setAttribute("type","text/javascript") 
    fileref.setAttribute("src", filename) 
} 
else if (filetype=="css"){ //if filename is an external CSS file 
    var fileref=document.createElement("link") 
    fileref.setAttribute("rel", "stylesheet") 
    fileref.setAttribute("type", "text/css") 
    fileref.setAttribute("href", filename) 
} 
if (typeof fileref!="undefined") 
    document.getElementsByTagName("head")[0].appendChild(fileref) 
}

取自here。

至于div内的图片，它很大程度上取决于您所指图片的类型。

<img>一个<div>内：

$（ 'img_selector_here'）ATTR（ “SRC”，newSrc）;一个<div>的
背景属性：

$（ 'div_selector'）。CSS（ '背景图像'， 'URL（img_url）'）;
<canvas>元素，就像dygraph产生的一个：找到适合您的具体需要一个很好的教程，你可以通过查看here，因为canvas元素提供吨的绘制和重绘选项启动。

来源

2014-07-13 12:10:37

使用包含脚本的长块动态更改div的源/内容

回答

相关问题