web-sys: DOM 世界问候

查看完整源代码 或 在线查看编译后的示例

使用 web-sys，我们可以与所有标准的 Web 平台方法进行交互，包括 DOM 的方法！这里我们来看一个简单的“世界，你好！”，它在 Rust 中制造一个 DOM 元素，对其进行自定义，然后将其追加到页面上。

Cargo.toml

您可以在此处看到我们如何依赖 web-sys 并激活相关功能以启用所有不同的 API

[package]
name = "dom"
version = "0.1.0"
authors = ["The wasm-bindgen Developers"]
edition = "2018"
rust-version = "1.57"

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

[dependencies]
wasm-bindgen = "0.2.92"

[dependencies.web-sys]
version = "0.3.4"
features = [
  'Document',
  'Element',
  'HtmlElement',
  'Node',
  'Window',
]

src/lib.rs

#![allow(unused)]
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(())
}
}