高效创建多个input

创建多个元素演示

// // 低效率
// window.onload = function () {
// // body…
// document.getElementById(‘btn’).onclick = function () {
// // body…
// var dvObj = document.getElementById(‘dv1’);

//     // 创建 100 个文本框
//     for (var i = 0; i < 100; i++) {
//       // 创建文本框
//       var txt = document.createElement('input');
//       txt.type = 'text';
//       txt.style.width = '80px';

//       dvObj.appendChild(txt);
//     }
//   };
// };





// 高效率
window.onload = function () {
  // body...
  document.getElementById('btn').onclick = function () {
    // body...
    var dvObj = document.getElementById('dv1');

    // 创建一个文档片段
    var fragment = document.createDocumentFragment();

    // 创建 100 个文本框
    for (var i = 0; i < 100; i++) {
      // 创建文本框
      var txt = document.createElement('input');
      txt.type = 'text';
      txt.style.width = '80px';

      fragment.appendChild(txt);
    }

    dvObj.appendChild(fragment);
  };
};

hello