如何使用 Javascript 动态嵌入 Java 小程序？答案

【问题标题】：How can I embed a Java applet dynamically with Javascript?如何使用 Javascript 动态嵌入 Java 小程序？
【发布时间】：2011-03-16 14:49:41
【问题描述】：

我希望能够使用按下按钮时调用的 Javascript 函数将 Java 小程序动态插入网页。（在页面加载时加载小程序会使事情变慢，冻结浏览器等...）我正在使用以下代码，它在 FF 中无缝运行，但在 IE8、Safari 4 和 Chrome 中没有错误消息而失败。有谁知道为什么这不能按预期工作，以及如何以适用于所有浏览器的方式动态插入小程序？我已经尝试按照其他地方的建议使用document.write()，但是在页面加载后调用它会导致页面被删除，所以这不是我的选择。

function createPlayer(parentElem)
{
    // The abc variable is declared and set here

    player = document.createElement('object');
    player.setAttribute("classid", "java:TunePlayer.class");
    player.setAttribute("archive", "TunePlayer.class,PlayerListener.class,abc4j.jar");
    player.setAttribute("codeType", "application/x-java-applet");
    player.id = "tuneplayer";
    player.setAttribute("width", 1);
    player.setAttribute("height", 1);

    param = document.createElement('param');
    param.name = "abc";
    param.value = abc;
    player.appendChild(param);

    param = document.createElement('param');
    param.name = "mayscript";
    param.value = true;
    player.appendChild(param);

    parentElem.appendChild(player);
}

【问题讨论】：

标签： java javascript internet-explorer dom applet

【解决方案1】：

我会建议做一些像你正在做的事情；所以我很困惑为什么它不起作用。

Here's a document 看起来很权威，好像是从马嘴里传出来的。它提到了不同浏览器的特性。你可能最终需要为不同的实现做不同的标签汤。

但也许applet/object标签有一些神奇的东西，如果动态插入它们就不会被处理。没有更多合格的建议，我有一个疯狂的解决方法可以为您提供：您如何在不同的页面上显示小程序，并动态创建一个IFRAME 以在您的小程序应占用的空间中显示该页面？ IFRAME 在跨浏览器的语法上更加一致，如果它们以同样的方式失败，我会感到惊讶。

也许您应该使用浏览器的调试工具在您交换小程序节点后查看 DOM。也许它没有出现在您认为的位置，或者与您认为正在创建的结构不同。您的代码对我来说看起来不错，但我对动态小程序不是很有经验。

【讨论】：

您好，感谢您的建议！ IFrame 想法很好，如果我不能让动态插入工作，我可能会使用它。插入小程序后确实查看了IE中的DOM，很奇怪。插入小程序时，我可以看到包含的 div 有所扩展以容纳小程序，但代码永远不会出现在 DOM 中，并且小程序永远不会执行。我不知道为什么会这样……

【解决方案2】：

document.write()

将覆盖您的整个文档。如果您想保留文档，并且只想添加一个小程序，则需要附加它。

var app = document.createElement('applet');
app.id= 'Java';
app.archive= 'Java.jar';
app.code= 'Java.class';
app.width = '400';
app.height = '10';
document.getElementsByTagName('body')[0].appendChild(app);

此代码会将小程序添加为 body 标记的最后一个元素。确保在处理完 DOM 后运行此程序，否则您将收到错误消息。正文 OnLoad，或 jQuery ready 推荐。

【讨论】：

感谢您非常明确的回答 +1。 Tho，我只是想让所有人都知道“app.code”值的“.class”不再是必需的。

【解决方案3】：

为此目的有一个 JavaScript 库： http://www.java.com/js/deployJava.js

// launch the Java 2D applet on JRE version 1.6.0
// or higher with one parameter (fontSize)
<script src=
    "http://www.java.com/js/deployJava.js"></script>
<script>
    var attributes = {code:'java2d.Java2DemoApplet.class',
        archive:'http://java.sun.com/products/plugin/1.5.0/demos/plugin/jfc/Java2D/Java2Demo.jar',
        width:710, height:540} ;
    var parameters = {fontSize:16} ;
    var version = '1.6' ;
    deployJava.runApplet(attributes, parameters, version);
</script>

【讨论】：

这个 javascript 库使用 document.write()，它会覆盖整个文档。请参阅我的答案以了解如何解决它。
这可能已在以后的版本中修复。

【解决方案4】：

我做了一些类似于 Beachhouse 建议的事情。我像这样修改了deployJava.js：

writeAppletTag: function(attributes, parameters) {
    ...

    // don't write directly to document anymore
    //document.write(startApplet + '\n' + params + '\n' + endApplet);

    var appletString = startApplet + '\n' + params + '\n' + endApplet;
    var divApplet = document.createElement('div');

    divApplet.id = "divApplet";
    divApplet.innerHTML = appletString;
    divApplet.style = "visibility: hidden; display: none;";

    document.body.appendChild(divApplet);
}

它在 Chrome、Firefox 和 IE 上运行良好。到目前为止没有问题。

我一开始尝试在我的 html 文件上创建一个 div 并将其 innerHTML 设置为 appletString，但只有 IE 能够动态检测到新的小程序。将整个div 直接插入body 适用于所有浏览器。

【讨论】：

【解决方案5】：

创建一个新的小程序元素并使用 appendChild 将其附加到现有元素。

var applet = document.createElement('applet');
applet.id = 'player';

...

var param = document.createElement('param');

...

applet.appendChild(param);
document.getElementById('existingElement').appendChild(applet);

另外，确保现有元素是可见的，也就是说你没有设置 css 隐藏它，否则浏览器在使用 appendChild 后将不会加载小程序。我花了太多时间试图弄清楚这一点。

【讨论】：

【解决方案6】：

这对我有用：

// my js code
    var app = document.createElement('applet');
    app.code= 'MyApplet2.class';
    app.width = '400';
    app.height = '10';

    var p1 = document.createElement('param');
    p1.name = 'sm_UnwindType';
    p1.value='200';
    var p2 = document.createElement('param');
    p2.name = 'sm_Intraday';
    p2.value='300';

    app.appendChild(p1);
    app.appendChild(p2);

    var appDiv = document.getElementById('applet_div');
    appDiv.appendChild(app);

-----html代码：

<div id="applet_div"></div>

【讨论】：