Question

我创建了一个带问题的提示框。回答后，您会在使用名为div的JavaScript创建的id2中收到答案。现在我正在尝试将id2放在id1前面，这是parentNode。所以它会在第一个div id1之上显示答案。有人可以向我解释为什么它不起作用吗？

<!DOCTYPE html>
<html>
<head>
<title>lab7</title>
<meta charset="utf-8" lang="en" name="my page" />
<style>
  .class1 {
      width: 100%;
      height: 60px;
      background-color: #BCC6CC;
         }  
</style>
<script type="text/javascript">
   function loadQ() {
     var firstdiv = document.createElement("div");
         firstdiv.setAttribute("class", "class1");
         firstdiv.setAttribute("id", "id1");
     var jw = prompt("Which movie is number 1 Box Office 2015?","Jurassic World");
     document.getElementById("id2").innerHTML ="" + jw + "   Made $652,198,011 Total Gross Sales";
     document.getElementById("id2").style.backgroundColor = "#786D5F";
     var id1 = document.getElementByTagName("div")[0];
     var parent1 = id1.parentNode();
     var beforeME = document.getElementByTagName("id2");
     parent1.insertBefore(id1, beforeME);

    };
</script>
</head>
<body onload="loadQ()">
   <div id="id1" class="class1">
     <br>
        <b>Top 2 Box Office Movie for 2015</b>
   </div>
   <div class="class2" id="id2">
   </div>
</body>
</html>

Answer 1

您的代码中至少存在两个问题：

<mvc:annotation-driven />需要<?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.springframework.org/schema/beans" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:context="http://www.springframework.org/schema/context" xmlns:mvc="http://www.springframework.org/schema/mvc" xmlns:tx="http://www.springframework.org/schema/tx" xsi:schemaLocation=" http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-4.1.xsd http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-4.1.xsd http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-4.1.xsd http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx-4.1.xsd"> <context:component-scan base-package="com.binoybaranwal.*" /> <mvc:annotation-driven /> <tx:annotation-driven /> </beans>（它会返回多个元素 s ）。
要按ID获取对象，您需要使用document.getElementsByTagName。

Answer 2

我重写了我的代码并使其更清晰。因此，每个div id和class都是定义的。

<script type="text/javascript">
        function loadQ() {
            var firstdiv = document.createElement("div");
                firstdiv.setAttribute("class", "class1");
                firstdiv.setAttribute("id", "id1");
                firstdiv.style.backgroundColor = "#BCC6CC;";
    document.getElementById('id1').innerHTML ="<h2 style='padding:20px;'>Top Box Office Movie 2015</h2>","<br><br>";

            var seconddiv = document.createElement("div");
                seconddiv.setAttribute("class", "class2");
                seconddiv.setAttribute("id", "id2");
                seconddiv.style.backgroundColor = "#786D5F";
                    var reper = document.getElementById('id1');
                    var parinte = reper.parentNode;
                        parinte.insertBefore(seconddiv, reper);
</script>

ParentNode和insertBefore

2 个答案: