从DOM-Reasonml/BuckleScript查询选择器中选择元素

如何使用Reason从DOM中选择项。我正在使用bs webapi进行DOM绑定，我想做的是：

let parent = document |> Document.querySelector(".parent");
let child = Element.querySelector(".child", parent);

---

但是，BuckleScript会抱怨，因为父对象的类型不正确。它表示父元素的类型为

option（Dom.element）

，父元素的类型应为

Dom.element.t

。我是一个新的理性主义者，我正在努力学习。我不明白

选项（Dom.element）

是什么意思，也不知道如何使上述代码块工作。非常感谢您提供的任何帮助

您需要打开选项变量，我们可以使用开关打开选项变量，并使用内置的无/部分变量

您可以在此处找到有关选项变体的一些文档：

以下是有关选项的更多文档：

为此，您需要将代码更改为以下内容：

let parent = document |> Document.querySelector(".parent");
let child = switch (parent) {
  | Some(p) => switch (Element.querySelector(".child", p)) {
    | Some(c) => c
    | None => raise(Failure("Unable to find child selector"))
  }
  | None => raise(Failure("Unable to find parent selector"))
};

let emptyEl = document |> Document.createElement("noscript");
let parent = document |> Document.querySelector(".parent");
let child = switch (parent) {
  | Some(p) => switch (Element.querySelector(".child", p)) {
    | Some(c) => c
    | None => {
      Js.log("Unable to find child selector");
      emptyEl;
    }
  }
  | None => {
    Js.log("Unable to find parent selector");
    emptyEl;
  }
};

如果您想改为登录控制台而不是失败，则需要返回有效的

Dom.element.t

，可以是这样的：

let parent = document |> Document.querySelector(".parent");
let child = switch (parent) {
  | Some(p) => switch (Element.querySelector(".child", p)) {
    | Some(c) => c
    | None => raise(Failure("Unable to find child selector"))
  }
  | None => raise(Failure("Unable to find parent selector"))
};

let emptyEl = document |> Document.createElement("noscript");
let parent = document |> Document.querySelector(".parent");
let child = switch (parent) {
  | Some(p) => switch (Element.querySelector(".child", p)) {
    | Some(c) => c
    | None => {
      Js.log("Unable to find child selector");
      emptyEl;
    }
  }
  | None => {
    Js.log("Unable to find parent selector");
    emptyEl;
  }
};

---

然后，您需要检查您的子元素是否是

noscript

，以查看您是否找到了要查找的子元素。

这是有效的。我是这样做的；然而，它被破坏了，因为我没有提出一个失败，而是试图在none中做一个Js.log。因此，在使用选项variant时，variant中的类型必须匹配？失败与Dom.element如何相同？谢谢你的回答，我只是想了解一下。是的，类型必须匹配。

Js.log

不起作用的原因是它实际上返回了一个

unit

类型。而raise返回的是

'a

类型，可以是任何类型。因此，在上面的例子中，它将是Dom.element.t。再次感谢您的回复-这解释了很多。如果我不想因为找不到父母而中断程序，那该怎么办？如果我只是想记录找不到家长怎么办？我试图在开关下方添加一个Js.log，但它没有记录，因为现在由于引发了故障，我得到了一个未捕获的异常。我已经更新了答案，以显示这两种方法，并希望能为您指明方向。