2012-12-05 51 views
3

如何將文本附加到web引擎?我嘗試這樣做:附加文本WebEngine - JavaFX

public TabMessage(String title) { 
    super(title); 
    view = new WebView(); 
    engine = view.getEngine(); 
    engine.loadContent("<body></body>"); 
    view.setPrefHeight(240); 
} 

private void append(String msg){ 
    Document doc = engine.getDocument(); 
    Element el = doc.getElementById("body"); 
    String s = el.getTextContent(); 
    el.setTextContent(s+msg); 
} 

但文件是null

回答

3

您還可以使用JavaScript來完成附加操作。

final WebEngine appendEngine = view.getEngine(); 
btn.setOnAction(new EventHandler<ActionEvent>() { 
@Override public void handle(ActionEvent event) { 
    appendEngine.executeScript(
    "document.getElementById('content').appendChild(document.createTextNode('World!'));" 
    ); 
} 
}); 

我有時會發現使用jQuery來操縱DOM而不是Java文檔或本機JavaScript DOM接口更簡單。

final WebEngine appendEngine = view.getEngine(); 
btn.setOnAction(new EventHandler<ActionEvent>() { 
@Override public void handle(ActionEvent event) { 
    executejQuery(appendEngine, "$('#content').append('World!');"); 
} 
}); 

... 

private static Object executejQuery(final WebEngine engine, String script) { 
    return engine.executeScript(
    "(function(window, document, version, callback) { " 
    + "var j, d;" 
    + "var loaded = false;" 
    + "if (!(j = window.jQuery) || version > j.fn.jquery || callback(j, loaded)) {" 
    + " var script = document.createElement(\"script\");" 
    + " script.type = \"text/javascript\";" 
    + " script.src = \"http://code.jquery.com/jquery-1.7.2.min.js\";" 
    + " script.onload = script.onreadystatechange = function() {" 
    + " if (!loaded && (!(d = this.readyState) || d == \"loaded\" || d == \"complete\")) {" 
    + " callback((j = window.jQuery).noConflict(1), loaded = true);" 
    + " j(script).remove();" 
    + " }" 
    + " };" 
    + " document.documentElement.childNodes[0].appendChild(script) " 
    + "} " 
    + "})(window, document, \"1.7.2\", function($, jquery_loaded) {" + script + "});" 
); 
} 

無論您使用Java API文檔,如Uluk擁有或JavaScript或JQuery的的API,所有Uluk的出色答卷其他點的仍然適用。

+0

嘿,如果我想刪除使用該webEngine(javafx)的jQuery的網站外觀的幾個圖像,你會介意分享指導@ jewelsea .... – gumuruh

5

首先,如果webengine無法加載內容或你叫engine.getDocument()之前的內容完全完成其加載文件返回null。

其次,doc.getElementById("body")搜索id爲「body」的DOM元素。但是,您加載的內容沒有這樣的ID或任何ID。

要了解這些好這裏是一個完整的可運行的例子,點擊按鈕:

package demo; 

import javafx.application.Application; 
import javafx.event.ActionEvent; 
import javafx.event.EventHandler; 
import javafx.scene.Scene; 
import javafx.scene.control.Button; 
import javafx.scene.layout.StackPane; 
import javafx.scene.web.WebEngine; 
import javafx.scene.web.WebView; 
import javafx.stage.Stage; 
import org.w3c.dom.Document; 
import org.w3c.dom.Element; 

public class Demo extends Application { 

    private WebView view; 
    private WebEngine engine; 

    @Override 
    public void start(Stage primaryStage) { 

     view = new WebView(); 
     engine = view.getEngine(); 
     engine.loadContent("<body><div id='content'>Hello </div></body>"); 
     view.setPrefHeight(240); 

     Button btn = new Button("Append the \"World!\""); 
     btn.setOnAction(new EventHandler<ActionEvent>() { 

      @Override 
      public void handle(ActionEvent event) { 
       append(" \"World!\""); 
      } 
     }); 

     StackPane root = new StackPane(); 
     root.getChildren().addAll(view, btn); 
     Scene scene = new Scene(root, 300, 250); 

     primaryStage.setScene(scene); 
     primaryStage.show(); 
    } 

    private void append(String msg) { 
     Document doc = engine.getDocument(); 
     Element el = doc.getElementById("content"); 
     String s = el.getTextContent(); 
     el.setTextContent(s + msg); 
    } 

    public static void main(String[] args) { 
     launch(args); 
    } 
} 

請注意,我已經把一個div id爲在人體第如此doc.getElementById("content")返回該專區的內容。

0

雖然答案很老,已經接受,但我在這裏發現我的發現。

訣竅是在控制器的init方法中調用engine.loadContent,然後嘗試在例如btn.setOnAction()中提到的某些操作上追加內容。通過這種方式,當您觸發操作時,頁面已經加載。如果我把代碼加載到setOnAction()本身,我將文檔作爲null。