Bazı web sayfalarında görmüşsünüzdür belli bir yere tıkladığınızda anında arama çubuğu oluşuverir.  Bu işlem Javascript ile HTML dökümanının düğümlerine erişim ile olur. İşi yapan Javascriptteki createElement, appendChild ve removeChild metotlarıdır.

Aşağıda bu işlemi yapacak bir kod göreceksiniz:

function arama_formu()
{

var formtag = document.createElement(‘form’); // FORM TAGI OLUSTURULUYOR
var form_yazi=“ARAMA:”;
//formtag.innerHTML=form_yazi;
formtag.setAttribute(“name”,“form1”);
formtag.setAttribute(“method”,“GET”);
formtag.setAttribute(“target”,“_blank”);
formtag.setAttribute(“action”,“http://www.google.com.tr/search?site=&hl=tr”);
var inputtag=document.createElement(“input”);
inputtag.setAttribute(“type”,“text”);
inputtag.setAttribute(“id”,“q”);
inputtag.setAttribute(“name”,“q”);

var dugme=document.createElement(“input”);
dugme.setAttribute(“type”,“submit”);
dugme.setAttribute(“id”,“button”);
dugme.setAttribute(“name”,“button”);
dugme.setAttribute(“value”,“Ara”);

var fani=document.getElementById(“fani”);
var fanidugme=fani.firstChild;
fani.removeChild(fanidugme);

formtag.appendChild(inputtag);
formtag.appendChild(dugme);

document.getElementById(‘apDiv1’).setAttribute(“class”,“tbar”);
document.getElementById(‘apDiv1’).appendChild(formtag);

}

SUAT ATAN AJAX DERSLERÄ°

Bu kodların çalışır hali için

http://suatatan.com/ajax/arge1/arama_formu_olustur.htm

Ancak bu kodlar şu an itibari ile Mozilla Firefox altında çalışmamaktadır. Nedeni bulunduğunda yeni versiyonu yazılacaktır.