Question

这可能听起来很愚蠢，但我没有找到实现这一目标的正确方法。我想创建一个元素（在我们的示例中为div元素）并向其添加textarea值。在我的例子中，似乎元素已创建，但我无法将其嵌入#notesPosition。我用JQuery实现了这一点，但我不确定最好的方法是用纯Javascript来实现它。

＆＃13;

var notesPositionToAdd = document.getElementById('notesPosition');
var notesTextareaBtn = document.getElementById('btnAddNotes');


notesTextareaBtn.addEventListener('click', function(e) {
  e.preventDefault();
  var notesTextarea = document.getElementById('addNotesTextarea').value;
  console.log(notesTextarea);
  var newEl = document.createElement('div');


  newEl.append(notesTextarea);
  newEl.className += " col-lg-2";
  console.log(newEl);



});

＆＃13;

<div class="row ">
  <div class="col-lg-4 col-md-4 col-sm-4 col-12 offset-md-8 ">
    <form id="newNoteForm">
      <div class="form-group offset-lg-6">
        <i class="fa fa-times text-md-right " aria-hidden="true"></i>
        <label for="addNotesTextarea">Add notes !</label>
        <textarea class="form-control" id="addNotesTextarea" rows="3"></textarea>
        <input class="btn btn-danger btn-sm" type="submit" value="Add" id="btnAddNotes">
      </div>
    </form>
  </div>
</div>
<div class="row" id="notesPosition">

</div>

＆＃13;

Answer 1

你好

检查这是否有帮助：

newEl.append(notesTextarea);
newEl.className += " col-lg-2";
console.log(newEl);

为：

newEl.append(notesTextarea);
newEl.className += " col-lg-2";  
notesPositionToAdd.append(newEl);
console.log(newEl);

我希望它能帮到你！

Answer 2

如果你想要addTextNode()，那么你可以......

var div = document.createElement('div');
var txt = document.createTextNode('Whatever Text');
    div.appendChild(txt);

替代地

var div = document.createElement('div')
    div.innerHTML = 'Whatever Text' // Whatever text parsed, <p>Words</p> is OK

替代地

var div - document.createElement('div')
    div.textContent = 'Whatever' // Not parsed as HTML

将元素附加到元素中

2 个答案: