将 WebView 中 DOM 节点的内容绑定到 StringProperty答案

【问题标题】：Bind the content of a DOM node in WebView to StringProperty将 WebView 中 DOM 节点的内容绑定到 StringProperty
【发布时间】：2016-01-14 00:58:19
【问题描述】：

我一直在尝试将 WebView 中的 html 文档内的 DOM 节点的内容绑定到 StringProperty。我所拥有的是这样的：

final String html = "<!DOCTYPE html><html><head><meta charset=\"UTF-8\"><script>function get(){return document.getElementsById('code')[0];}</script><style>body{font-family:\"Monospaced\";}</style></head><body><pre id=\"code\"></pre></body></html>";

engine.loadContent(html);
final JSObject pre = (JSObject) engine.executeScript("get()"); // Defined in html

property.addListener((ob, o, n) -> {
    pre.setMember("innerHTML", n);
});

当我执行程序并修改 StringProperty 时，我得到如下异常：

线程“JavaFX 应用程序线程”netscape.javascript.JSException 中的异常：ReferenceError：找不到变量：get

我不确定我是否走在正确的轨道上。似乎应该可以监听属性中的更改并使用 javascript 将这些更改推送到文档中。我做错了吗？

【问题讨论】：

WebView 中的内容是异步加载的。您必须等待WebView 完成加载内容。

标签： javascript java javafx webview

【解决方案1】：

Javascript 中没有getElementsById 函数。 ID 是唯一的。如果需要多个选择器，请使用 getElementById（不是元素，也没有数组表示法）或使用另一个选择器。

JSFiddle 示例基于您的代码：https://jsfiddle.net/jkennaly/db88u9f3/3/

【讨论】：

正确，但不是此错误的原因。（错误消息提到get，而不是getElementsById）。我猜这个错误只是脚本执行时没有加载页面。
确实如此。也许在转义引号或其他东西时有错误？我知道我将该字符串复制到 jsfiddle 中，并得到了同样的错误。然后我清理了所有东西，包括 getElementsById，它运行没有错误。这可能是我改变的其他东西。