猿问

为什么此DOM代码没有出现在页面上？

我正在写作业，我必须制作一个页面，其中包含10本书，其中包含有关使用DOM及其封面图像的一些信息，即使我将JS文件链接到HTML文件，打开时也看不到任何内容我的HTML文件在浏览器中。我究竟做错了什么？


'use strict';


{


  const booksObj = {

    how_to_create_a_mind: {

      title: 'How to Create a Mind: The Secret of Human Thought Revealed',

      author: 'Ray Kurzweil',

      language: 'english',

    },

    universe_from_nothing: {

      title: 'A Universe from Nothing',

      author: 'Lawrence M. Krauss',

      language: 'english',

    },

    sapiens: {

      title: 'Sapiens: A Brief History of Humankind',

      author: 'Yuval Noah Harari',

      language: 'english',

    },

    homo_deus: {

      title: 'Homo Deus: A Brief History of Tomorrow',

      author: 'Yuval Noah Harari',

      language: 'english',

    }

  };



  const root = document.getElementById('root');


  function booksList() {

    const div = document.createElement('div');

    root.appendChild(div);

    const h1 = document.createElement('h1');

    div.appendChild(h1);

    h1.appendChild(document.createTextNode('My List Of Books'));


    for (const key in booksObj) {

      const h2 = document.createElement('h2');

      root.appendChild(h2);

      h2.appendChild(document.createTextNode(booksObj[key]['title']));

      const author = document.createElement('p');

      root.appendChild(author);

      author.appendChild(document.createTextNode(booksObj[key]['author']));

      const language = document.createElement('p');

      root.appendChild(language);

      language.appendChild(document.createTextNode(booksObj[key]['language']));

      const img = document.createElement('img');

      root.appendChild(img);

      img.appendChild(document.createTextNode(booksObj[key]['images']));

      img.src = bookImage;

    }

  }

  booksList();

<div id="root"></div>


慕森卡
浏览 132回答 3
3回答

慕工程0101907

'use strict';{&nbsp; const booksObj = {&nbsp; &nbsp; how_to_create_a_mind: {&nbsp; &nbsp; &nbsp; title: 'How to Create a Mind: The Secret of Human Thought Revealed',&nbsp; &nbsp; &nbsp; author: 'Ray Kurzweil',&nbsp; &nbsp; &nbsp; language: 'english'&nbsp; &nbsp; },&nbsp; &nbsp; universe_from_nothing: {&nbsp; &nbsp; &nbsp; title: 'A Universe from Nothing',&nbsp; &nbsp; &nbsp; author: 'Lawrence M. Krauss',&nbsp; &nbsp; &nbsp; language: 'english'&nbsp; &nbsp; },&nbsp; &nbsp; sapiens: {&nbsp; &nbsp; &nbsp; title: 'Sapiens: A Brief History of Humankind',&nbsp; &nbsp; &nbsp; author: 'Yuval Noah Harari',&nbsp; &nbsp; &nbsp; language: 'english'&nbsp; &nbsp; },&nbsp; &nbsp; homo_deus: {&nbsp; &nbsp; &nbsp; title: 'Homo Deus: A Brief History of Tomorrow',&nbsp; &nbsp; &nbsp; author: 'Yuval Noah Harari',&nbsp; &nbsp; &nbsp; language: 'english'&nbsp; &nbsp; }&nbsp; };&nbsp; const root = document.getElementById('root');&nbsp; function booksList() {&nbsp; &nbsp; const div = document.createElement('div');&nbsp; &nbsp; root.appendChild(div);&nbsp; &nbsp; const h1 = document.createElement('h1');&nbsp; &nbsp; div.appendChild(h1);&nbsp; &nbsp; h1.appendChild(document.createTextNode('My List Of Books'));&nbsp; &nbsp; for (const key in booksObj) {&nbsp; &nbsp; &nbsp; const h2 = document.createElement('h2');&nbsp; &nbsp; &nbsp; root.appendChild(h2);&nbsp; &nbsp; &nbsp; h2.appendChild(document.createTextNode(booksObj[key]['title']));&nbsp; &nbsp; &nbsp; const author = document.createElement('p');&nbsp; &nbsp; &nbsp; root.appendChild(author);&nbsp; &nbsp; &nbsp; author.appendChild(document.createTextNode(booksObj[key]['author']));&nbsp; &nbsp; &nbsp; const language = document.createElement('p');&nbsp; &nbsp; &nbsp; root.appendChild(language);&nbsp; &nbsp; &nbsp; language.appendChild(document.createTextNode(booksObj[key]['language']));&nbsp; &nbsp; &nbsp; const img = document.createElement('img');&nbsp; &nbsp; &nbsp; root.appendChild(img);&nbsp; &nbsp; &nbsp; let bookImage = img.appendChild(document.createTextNode(booksObj[key]['images']));&nbsp; &nbsp; &nbsp; img.src = bookImage;&nbsp; &nbsp; }&nbsp; }&nbsp; booksList();}<!DOCTYPE html><html><head>&nbsp; <meta charset="utf-8">&nbsp; <meta http-equiv="X-UA-Compatible" content="IE=edge">&nbsp; <title>Page Title</title>&nbsp; <meta name="viewport" content="width=device-width, initial-scale=1">&nbsp; <link rel="stylesheet" type="text/css" media="screen" href="style.css"></head><body>&nbsp; <div id="root"></div>&nbsp; <script type='text/javascript' src='app.js'></script></body></html>
0

桃花长相依

您似乎}在脚本末尾缺少a&nbsp;。在这里查看小提琴https://jsfiddle.net/fwL0vx46/您的代码导致unexpected end of input异常，该异常显示在开发人员工具控制台中。
0
随时随地看视频慕课网APP

相关分类

JavaScript
我要回答