存储包含html标签的文本

时间:2016-05-09 06:11:03

标签: javascript html css arrays object

我想要存储的字符串和对象。字符串中的某些文本需要特殊格式,特别是它必须是下标。我试过简单地编写 元素标签。显示时,标签显示在页面上。我创建了一个变量保存标签,那里附加了内容到变量,子元素没有效果。尝试将.innerHTML添加到变量中,仍然没有快乐。任何想法都是。

var quizDiv = document.createElement("div")
  //gives from element and id attribute
quizDiv.setAttribute("id", "airspeedIndicatorQuiz")
  //retreives element on page inwhitch to place form and saves it in variable
var makeNewPage = document.getElementById("newPage")
  //appentds input form to makeNewPage
makeNewPage.appendChild(quizDiv)

//creat sub element and store in variable vso
var vso = document.createElement("sub")
  //creat text node and store in variable vsoText
var vsoText = document.createTextNode("SO")
  //append vsoText to vso
vso.appendChild(vsoText)

console.log(vso)
var aIMakingsObj = [{
  marking: "White arc",
  meaning: "Flap oparating range"
}, {
  marking: "V" + vso.innerHTML + " Lower A/S Limit White Arc",
  meaning: "Stall speed landing configuration"
}, {
  marking: "V<sub>FE</sub> Upper A/S Limit White Arc",
  meaning: "Maximum flap extention speed"
}, {
  marking: "Green Arc",
  meaning: "Normal Oparating Range"
}, {
  marking: "V" + '<sub>S1</sub>' + " Lower A/S Limit Green Arc",
  meaning: "Maximum flap extention speed"
}, {
  marking: "V<sub>NO</sub> Upper A/S Limit Green Arc",
  meaning: "Maximum structural cruse speed"
}, {
  marking: "Yellow Arc",
  meaning: "Caution Range (oparations in smooth air only)"
}, {
  marking: "V" + '<sub>NE</sub>' + " Red Line",
  meaning: "never exceed speed; above this speed structural failure may occure"
}]

displayQuiz()

function displayQuiz() {


  for (i = 0; i < aIMakingsObj.length; i++) {


    var aPool = document.createElement("p")
    var aPoolTex = document.createTextNode(aIMakingsObj[i].marking)
    aPool.appendChild(aPoolTex)
    makeNewPage.appendChild(aPool)
  }
}
<!DOCTYPE html>
<html>

<head>
  <title></title>
  <link rel="stylesheet" type="text/css" href="css/main.css">
</head>

<body id="newPage">




  <script src="js/main.js"></script>
</body>

</html>

1 个答案:

答案 0 :(得分:0)

innerHTML似乎正在发挥作用。

<!DOCTYPE html>
<html>

<head>
  <title></title>
  <link rel="stylesheet" type="text/css" href="css/main.css">
</head>

<body id="newPage">




  <script src="js/main.js"></script>
</body>

</html>
@media