如何从 Go WebAssembly 访问 DOM 元素属性？

Question

我正在尝试扩展 https://github.com/golang/go/wiki/WebAssembly 中的 "Hello WebAssembly" 示例。如前所述，该示例只是将一条消息打印到控制台。我想使用 syscall/js 添加一些代码来替换正文元素内容。

以下尝试构建失败：

package main

import (
    "fmt"

    "syscall/js"
)

func main() {
    fmt.Println("Hello, WebAssembly!") // original example
    // I added
    doc := js.Global().Get("document")
    body := doc.Call("getElementById", "thebody")
    body.innerHTML = "Dynamic Content"
}

当我尝试使用 $ env GOOS=js GOARCH=wasm go build -o main.wasm 构建时我得到： ./wasm.go:14:6: body.innerHTML undefined (type js.Value has no field or method innerHTML)

仔细想想这并不奇怪，但我在 https://godoc.org/syscall/js 的文档中没有看到解释如何获取和设置元素属性的示例。

Answer 1

要获取某些 JavaScript 对象的任何属性的值，请使用 Value.Get() method (you actually already used it when you accessed the document object by calling js.Global().Get("document")). Similarly, to set a value of a property, use Value.Set().

要获取/设置其值的属性的名称只是一个 Go string 值，在您的例子中是 "innerHTML"。设置的值可能是Go的很多值（如string、整数、浮点数、bool、切片、映射等），最终设置的js.ValueOf() function is used to obtain a js.Value() .在您的情况下，您可以简单地使用 Go string 值 "Dynamic Content".

doc := js.Global().Get("document")
body := doc.Call("getElementById", "thebody")
body.Set("innerHTML", "Dynamic Content")

如何从 Go WebAssembly 访问 DOM 元素属性？

How can I access DOM Element properties from Go WebAssembly?

go

webassembly