有没有更好的方法来对此进行编码？（初学者）

Could there have been a better way to code this? (Beginner)

注意：我正在尝试学习如何使用 javascript 而不是 jquery 或其他库。

我是 javascript 的新手，我想了解它是如何工作的，并且想知道是否有更有效的编码方法。

function myFunction() {
    var domObject = document.createElement("li"),
        userName = document.getElementById("userName").value,
        userNameText = document.createTextNode(userName);

    domObject.appendChild(userNameText);
    document.getElementById("myList").appendChild(domObject);
    document.getElementById("userName").value = "";
}

<body>
    <input type="text" id="userName">
    <button onclick="myFunction()">Click</button>
    <ul id="myList">
        <li>this is</li>
        <li>just a</li>
        <li>test to</li>
        <li>append children</li>
    </ul>
    <script src="main.js"></script>
</body>

domObject 当然不是变量的最佳名称（myFunction 也不是）。无论如何，使用 addEventListener 而不是内联事件侦听器：

// you can, of course, use getElementById with an ID attribute
var input = document.querySelector('input');
var button = document.querySelector('button');
var list = document.querySelector('ul');

button.addEventListener('click', function () {
  var li = document.createElement('li');
  li.textContent = input.value;
  input.value = '';
  list.appendChild(li);
});

<input type="text">
<button>Add to list</button>
<ul></ul>