javascript dom appendChild错误

Question

$.each($('#income_ranges').children(), function(key, value) {
  var field_row = value.getElementsByTagName("input");

  $.each(field_row, function(key, value) {
    if(value.value == "") {
        value.appendChild("<div> cant be blank </div>");
    }
  })
})

我想将以下div附加到value上，但出现错误，指出value.appendChild不是一个函数。

在我的代码值是一个HTMLInputElement，我想在元素下面输入div，但是我得到了那个烦人的错误。

<input class="string required" id="lender_dsr_max_threshold_income_ranges_attributes_1437717712398_income_range" name="lender_dsr_max_threshold[income_ranges_attributes][1437717712398][income_range]" type="text">

任何帮助深表感谢

Answer 1

这里有两个问题，

1. value是输入元素，因此不能有子元素
2. appendChild采用节点作为其参数，而不是字符串

由于要在#income_ranges的后代input之后添加div ，因此请使用后代选择器 （选择input元素）和after（） （将div作为input的下一个兄弟插入）

$('#income_ranges input').filter(function () {
    return this.value == ''
}).after('<div> cant be blank </div>')

Answer 2

感谢您的所有建议。 我这样解决了

$.each($('#income_ranges').children(), function(key, value) {
  var field_row = value.getElementsByTagName("input");

  $.each(field_row, function(key, value) {
    if(value.value == "") {
       $(this).after("<div> cant be blank </div>");
    }
  })
})