如下一段js可以如此用吗?

如下一段代码:

 <form action="calcSquare.php">
 <p>
  <label for=x>Number</label>:
  <input id="x" name="x" type="number">
 </p>
 <script>
  var x = document.getElementById('x');
  var output = document.createElement('p');
  output.textContent = 'Type a number; it will be squared right then!';
  x.form.appendChild(output);
  x.form.onsubmit = function () { return false; }
  x.oninput = function () {
    var v = x.valueAsNumber;
    output.textContent = v + ' squared is ' + v * v;
  };
 </script>
 <noscript>
  <input type=submit value="Calculate Square">
 </noscript>
</form>

这里,x.form.appendChild(output),可以如此用吗?谁能解释一下?这是我我在W3C里看到的一段代码

input对象的form属性为input所在form对象,ie8-不支持oninput和textContent属性。oninput同时添加onpropertychange,textContent改为innerHTML

x是id为x的input,x.form 指向的就是x所在form,然后appendChild就是添加新的child元素

但是input的form属性在ie中不支持,form属性的详情:

 http://www.w3schools.com/tags/att_input_form.asp