JavaScript를 사용하여 양식 만들기

Question

그래도 여전히 매우 새로운 JS입니다. 내가하고있는 것을 100 % 확신하지 못합니다.

자바 스크립트를 사용하여 입력 폼이있는 새 창을 만들고 싶습니다.

하나의 옵션 드롭 다운으로 기본 창을 사용할 수 있었지만 양식 작동 방법을 고민 중입니다.

var i, l, options = [{ 
    value: 'fName', 
    text: 'First Name:' 
}, 
{ 
    value:'lName', 
    text:'Last Name:' 
}, 

{ 
    value: 'age', 
    text: 'Age:' 
}, 
{ 
    value:'city:', 
    text:'City:' 
}, 
{ 
    value:'state', 
    text:'State:' 
}, 

{ 
    value:'zCode', 
    text:'Zip Code:' 
} 
        ], 

newWindow = window.open("", null, "height=200,width=400,status=yes,toolbar=no,menubar=no,location=no"); 

newWindow.document.write("<select onchange='window.opener.setValue(this.value);'>"); 
for(i=0,l=options.length; i<l; i++) { 
    newWindow.document.write("<option value='"+options[i].value+"'>"); 
    newWindow.document.write(options[i].text); 
    newWindow.document.write("</option>"); 
} 

newWindow.document.write("</select>"); 
newWindow.document.title = "Info Window"; 

이 잘 작동하지만 난 형태의 구조에 이상이 전환하는 방법을 알아낼 수 없습니다. 어떤 도움이라도 대단히 감사합니다.

Answer 1

원시 HTML을 작성하는 대신 DOM 요소 객체로 작업해야합니다. 다음과 같이 양식을 새 창에 추가 할 수 있습니다.

// create a form and set properties 
var form = document.createElement('form'); 
form.action = 'http://google.com'; 
form.method = 'post'; 

// insert into the body of the new window 
newWindow.document.body.appendChild(form); 

// add text before the input 
var p = document.createElement('p'); 
form.appendChild(document.createTextNode('Enter text:')); 

// add a text input 
var input = document.createElement('input'); 
input.type = 'text'; 
input.name = 'test'; 
input.value = 'this is an input'; 
form.appendChild(input);