0

我尝试解析，但它不会像我的教授那样显示，即使我认为我准确地写下了他所做的。

<div class="main">
<p>Heads or tails? click to toss the coin</p>
<p>IDEA- use this game to decide on comissioning a cute drawing of a cat nose or cat butt!</p>
  <button  onclick="flipCoin()">Flip coin</button>
<p id="responseText"></p>
</body>
</html>
  <script>
  //makes the coin flip! or at least generates a code to simulate it 
 function flipCoin () {
const data = null;

const xhr = new XMLHttpRequest();
xhr.withCredentials = true;
//where the magic happens aka the words appear
xhr.addEventListener("readystatechange", function () {
    if (this.readyState === 4 && this.status == 200) {
        console.log(this.responseText);
           var responseText = (JSONobject.thistext);
    }
    
});

xhr.open("GET", "https://coin-flip1.p.rapidapi.com/headstails",true);
xhr.setRequestHeader("x-rapidapi-key", "XXXXX");
xhr.setRequestHeader("x-rapidapi-host", "coin-flip1.p.rapidapi.com");

xhr.send(data);
}
    </script>

我认为问题在于var responseText = (JSONobject.thistext); 请帮助我通过这门课的部分

4

2 回答 2

1

您的代码中没有任何地方定义了 JSONobject。

您可能打算使用 JSON.parse 解析响应。

我不确定 SO 帮助学业的政策，所以我就这样吧。

注意：注意你的控制台输出！如果你要运行你的程序，控制台会输出“Uncaught ReferenceError: JSONobject is not defined”

于 2020-11-17T21:53:18.233 回答
0

<script>标签的放置

标签位于<script> ... </script>结束</html>标签之后。这意味着脚本不会被执行，因为它不是页面的一部分，因此不会被执行。

脚本的位置很重要。如果你有一个选择 HTML 元素的脚本，那么它需要放在它需要的元素之后。如果是这种情况，通常最好将其放置在尽可能低的位置（在结束</body>标记之前）。

    <script>
    ...
    </script>
  </body>
</html>

如果需要在呈现页面之前执行某些操作，那么将其放置在<head>将是一个好地方。您的页面是从上到下执行的，请记住这一点。

解析 JSON

的结果XMLHttpRequest可以在responseText属性中找到。responseText顾名思义，这始终是一种文本形式，如字符串。你的教授可能要求你把那个字符串变成一个对象。

将字符串解析为对象可以使用JSON.parse(). 如果字符串具有有效的 JSON 结构，此函数需要一个字符串并返回一个对象或数组。

xhr.addEventListener("readystatechange", function () {
  if (this.readyState === 4 && this.status == 200) {
    var JSONObject = JSON.parse(this.responseText);
    console.log(JSONObject);
  }
});

的值JSONObject应该是一个具有一个称为结果的属性的对象。该属性的值应为"Heads"或"Tails"，如下例所示。

{
  outcome: "Tails"
}

现在，因为您将此对象存储在 中，JSONObject您可以使用JSONObject.outcomeor访问它的属性JSONObject["outcome"]。两种语法的作用相同，但后者能够使用数字或一些非字母字符来访问或创建属性。但是，如果您知道名称，则前者（点表示法）最容易输入。

显示结果

现在要完成它，您只需将硬币翻转请求的结果显示到一个元素中。这是您必须查看 HTML 并检查您要选择的元素的地方。如果它有一个id属性，那么您可以使用以下行来选择该元素。

var element = document.getElementById("responseText");

现在element是对<p id="responseText"></p>. 因此，例如，如果您想更改该元素的文本，则可以通过更改该元素的innerTextortextContent属性的值来实现。

var text = "Hi";
element.textContent = text;

从这里你需要将这三个部分拼凑在一起。然后你会运行脚本。因为这是一项家庭作业，所以你必须完全理解你所写的内容，所以如果你有任何问题，请务必询问。

另外组织您的 HTML。使您的代码更具可读性可以更容易地找到可能遇到的任何错误。

缩进拯救生命！.

于 2020-11-17T22:26:30.760 回答