Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/439.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/0/vba/14.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
javascript本地存储添加到表_Javascript_Jquery_Html - Fatal编程技术网

javascript本地存储添加到表

javascript本地存储添加到表,javascript,jquery,html,Javascript,Jquery,Html,对于一个任务,我需要使用javascript/jquery,但我是新手。我有一个表格,里面有一些文本框,我可以在那里创建一个新的动物。该动物将被添加到名为animal_list的数组中 Animal_列表将添加到localstorage中,并且工作正常。但我想要的是从本地存储中加载所有动物,并将它们添加到表中。将被储存的动物类型是猫或狗,它们也有自己的桌子 我有一个console.log,在那里我写动物的类型,这显示了正确的输出3只狗,2只猫,但它们不会被添加到表中 这是我的HTML代码: &l

对于一个任务,我需要使用javascript/jquery,但我是新手。我有一个表格,里面有一些文本框,我可以在那里创建一个新的动物。该动物将被添加到名为animal_list的数组中

Animal_列表将添加到localstorage中,并且工作正常。但我想要的是从本地存储中加载所有动物,并将它们添加到表中。将被储存的动物类型是猫或狗,它们也有自己的桌子

我有一个console.log,在那里我写动物的类型,这显示了正确的输出3只狗,2只猫,但它们不会被添加到表中

这是我的HTML代码:

<div class="row">
    <div class="col-lg-6">
      <h3>Honden</h3>
      <table id="dog" class="table table-hover table-striped table-condensed">
        <thead>
          <tr>
            <th>CRN</th>
            <th>Name</th>
            <th>DoB</th>
            <th>Gender</th>
            <th>Last Walk Date</th>
          </tr>
        </thead>
      </table>
    </div>
    <div class="col-lg-6">
      <h3>Katten</h3>
      <table id="cat" class="table table-hover table-striped table-condensed">
        <thead>
          <tr>
            <th>CRN</th>
            <th>Name</th>
            <th>DoB</th>
            <th>Gender</th>
            <th>Bad Habits</th>
          </tr>
        </thead>
      </table>
    </div>
  </div>
对猫也是如此

document.getElementById("dog");
但是没有结果

有人能帮我解决这个问题吗

提前谢谢

编辑: 我发现一个输入错误animal.type应该是animal.type。更改后,我在控制台中收到一条错误消息:

TypeError:null不是计算“table.insertRow”的对象


我使用jQuery将localStorage中的对象添加到表中

这是狗桌的一个例子

if(animal.Type == "dog")
        {
          // animal is a dog
          var table = document.getElementById("dog");

          $("#dog").append("<tr><td>" + animal.Crn + "</td><td>" + animal.Name + "</td><td>" + animal.Dob +"</td><td>" + animal.Gender + "</td><td>" + animal.Special + "</td></tr>");
        }

尝试console.logArray.isArrayanimal_列表;在你的if声明之前提示:看一下这个,似乎有很多对动物内部的操纵。在现实生活中,你不需要将宠物从一个地方移动到另一个地方,而在JS中,通常有一种方法可以用一条语句移动数据结构或HTML块,该语句不需要知道内部结构,而是复制整个内容,不管它是什么。
document.getElementById("dog");
if(animal.Type == "dog")
        {
          // animal is a dog
          var table = document.getElementById("dog");

          $("#dog").append("<tr><td>" + animal.Crn + "</td><td>" + animal.Name + "</td><td>" + animal.Dob +"</td><td>" + animal.Gender + "</td><td>" + animal.Special + "</td></tr>");
        }