檢視完整原始碼 或 線上檢視已編譯的範例

使用 web-sys，我們可以與所有標準的 Web 平台方法互動，包括 DOM 的方法！在這裡，我們來看一個簡單的「你好，世界！」的例子，它在 Rust 中建立一個 DOM 元素，自訂它，然後將其附加到頁面。

您可以在這裡看到我們如何依賴 web-sys 並啟動相關的功能來啟用所有各種 API

[package]
authors = ["The wasm-bindgen Developers"]
edition = "2021"
name = "dom"
publish = false
version = "0.0.0"

[lib]
crate-type = ["cdylib"]

[dependencies]
wasm-bindgen = { path = "../../" }

[dependencies.web-sys]
features = ['Document', 'Element', 'HtmlElement', 'Node', 'Window']
path = "../../crates/web-sys"

[lints]
workspace = true

# #![allow(unused_variables)]
#fn main() {
use wasm_bindgen::prelude::*;

// Called by our JS entry point to run the example
#[wasm_bindgen(start)]
fn run() -> Result<(), JsValue> {
    // Use `web_sys`'s global `window` function to get a handle on the global
    // window object.
    let window = web_sys::window().expect("no global `window` exists");
    let document = window.document().expect("should have a document on window");
    let body = document.body().expect("document should have a body");

    // Manufacture the element we're gonna append
    let val = document.create_element("p")?;
    val.set_text_content(Some("Hello from Rust!"));

    body.append_child(&val)?;

    Ok(())
}

#}