JSFiddle - React, Tailwind, and code Playground

by zhouyulong

HTML

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
    <ul id="list">
        <li>HTML</li>
        <li>CSS</li>
        <li>JavaScript</li>
    </ul>     
    列项文本:<input id="txt" type="text"/><br />
    <input type="button" value="插入新项" onclick="insert()" />
</body>
</html>

JavaScript

function insert() {
var e = document.createElement("li");
var str = document.getElementById("txt").value; //获取文本框的值
var txt = document.createTextNode(str);
e.appendChild(txt);
var list = document.getElementById("list");
list.appendChild(e);
}