divラッパーから入力を削除するにはどうすればよいですか？

Question

divラッパーから入力を削除するにはどうすればよいですか？ 「マイナス」ボタンをクリックすると、フォームセクションのみが削除されますか？ 私はこのような行があり、この関数セクションのみを対象にしたいと考えています。 *初心者ですが、説明する方法がわかりません。

var input_count = 1; 
var form_array = []; 
function AddInputField() { 
    var form = new Main_Input_Field(); 
    form_array.push(form); 
} 

function Main_Input_Field() { 
    //if(document.getElementById("frm_drno").value != "") { 
    if(true) { 
     var main_fild = document.getElementById("main_fieldset"); 
     var temp_form = document.createElement("form"); 
     main_fild.appendChild(temp_form); 

     item_no = document.createElement("button") 
     item_no.innerHTML = input_count; 
     item_no.setAttribute("style", "width:35px"); 
     item_no.disabled = true; 
     temp_form.appendChild(item_no); 

     var temp_element = document.getElementById("form_temp").children; 

     for(var i=0; i < temp_element.length; i++) { 
      input = document.createElement("input"); 

      var attri = temp_element[i].getAttribute("type"); 
      input.setAttribute("type", attri); 

      attri = temp_element[i].getAttribute("id"); 
      input.setAttribute("id", attri); 

      attri = temp_element[i].getAttribute("name"); 
      input.setAttribute("name", attri); 

      attri = temp_element[i].getAttribute("size"); 
      input.setAttribute("size", attri); 

      attri = temp_element[i].getAttribute("style"); 
      input.setAttribute("style", attri); 

      input.setAttribute("value", temp_element[i].value); 
      temp_element[i].value = ""; 

      if(i >= 11 && i <= 13) { 
       input.readOnly = true; 
      } 
      temp_form.appendChild(input); 
     } 

     //When I click this button it removes this form section only? 
     // note that I have like hundred of this line and I want to target 
     // this function section only. 
     del_btn = document.createElement("button") 
     del_btn.innerHTML = "-"; 
     del_btn.addEventListener ("click", function() { 
      var num = item_no.innerHTML; 
      console.log(num); 
      alert(num); 
     }); 

     temp_form.appendChild(del_btn); 
     main_fild.style.display = "block"; 

     input_count++; 
    } 
    else { 
     alert("Unable to ADD!!\nFieldset must not empty!!"); 
    } 
} 

my layout demonstrated here

Answer 1

リファレンスhttps://stackoverflow.com/a/5865511/5144902

document.getElementById(id).style.visibility= "hidden"; 
document.getElementById(id).style.visibility= "visible"; 

Answer 2

応答をありがとうしかし、私はそれを修正しましたように思えます。

function Main_Input_Field() { 
 
\t ... 
 
\t var temp_form = document.createElement("form"); 
 
\t ...... 
 

 
\t ...... 
 
\t del_btn = document.createElement("button")//<<<<----- this is the problem causing chrome to reload the page 
 
\t del_btn.innerHTML = "-"; 
 
\t del_btn.setAttribute("type", "button"); //<<<<----- Adding this line fix it. 
 
\t del_btn.addEventListener ("click", function() { 
 
\t \t temp_form.remove(); // this is the guy who get the job done. 
 
\t }); 
 
}