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

Golang小白一枚，正在不断学习积累知识，现将学习到的知识记录一下，也是将我的所得分享给大家！而今天这篇文章《如何从 Go WebAssembly 访问 DOM 元素属性？》带大家来了解一下##content_title##，希望对大家的知识积累有所帮助，从而弥补自己的不足，助力实战开发！

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

以下尝试构建失败：

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 未定义（类型 js.value 没有字段或方法 innerhtml）

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

解决方案

要获取某个 javascript 对象的任何属性的值，请使用 Value.Get() 方法（当您通过调用 js.global().get("document") 访问文档对象时，实际上已经使用了该方法）。同样，要设置属性的值，请使用 Value.Set()。

要获取/设置的值的属性名称只是一个 go string 值，在您的情况下为 "innerhtml" 。要设置的值可能是多个go值（例如string、整数、浮点数、bool、切片、映射等），js.ValueOf()函数用于获取最终要设置的js.Value()。在您的情况下，您可以简单地使用 go string 值 "dynamic content"。

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

以上就是《如何从 Go WebAssembly 访问 DOM 元素属性？》的详细内容，更多关于的资料请关注golang学习网公众号！