Select Nesnesi

Nis 10th, 2007
yazar Zihni.
Henüz yorum yok

Select nesnesi html formlarındaki dropdown listesini temsil eder.

Aşağıdaki gibi bir belgemiz olsun.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

<html>
<head>
</head>
<body>
<form id="myForm">
<select name="ddlKitap" id="ddlKitap">
<option value="">Seçiniz</option>
<option value="1" selected="selected">Vadideki Zambak</option>
<option value="2">Şu Çılgın Türkler</option>
<option value="3">Bozkırkurdu</option>
</select>
</form>
</body>
</html>
// select nesnesindeki seçilen elemanın endeksini bulmak.
var secilenEndeks = document.getElementById('ddlKitap').selectedIndex;
// Çıktı: 1
// select nesnesinin değerini options dizisinden çekeriz.
var secilenDeger = document.getElementById('ddlKitap').options[secilenEndeks].value;
// Çıktı: Vadideki Zambak
// 2 numaralı değere sahip Şu çılgın Türkler optionunu seçili hale getirelim
document.getElementById('ddlKitap').options[2].selected = true;

Kategori: Document Object Model.
Etiketler:

nodeType Özelliği

Nis 10th, 2007
yazar Zihni.
Henüz yorum yok

Sözdizimi:

type = node.nodeType
Bir düğümün türünü gösterir. Aşağıdaki değerlerden birini döndürür.

  • Node.ELEMENT_NODE == 1
  • Node.ATTRIBUTE_NODE == 2
  • Node.TEXT_NODE == 3
  • Node.CDATA_SECTION_NODE == 4
  • Node.ENTITY_REFERENCE_NODE == 5
  • Node.ENTITY_NODE == 6
  • Node.PROCESSING_INSTRUCTION_NODE == 7
  • Node.COMMENT_NODE == 8
  • Node.DOCUMENT_NODE == 9
  • Node.DOCUMENT_TYPE_NODE == 10
  • Node.DOCUMENT_FRAGMENT_NODE == 11
  • Node.NOTATION_NODE == 12

Aşağıdaki gibi bir belgemiz olsun.

<html>
<head>
</head>
<body>
<div id=”myDiv”>
<a href=”http://www.norajones.com”>Norah Jones</a>
<a href=”http://www.braziliangirls.com”>Brazilian girls</a>
<a href=”http://www.lizzright.com”>Lizz Wright</a>
</div>
</body>
</html>

<script type=”text/javascript”>
// div etiketinin içindeki ilk a nodu çekiyoruz
var nodeElement = document.getElementById(‘myDiv’).getElementsByTagName(‘a’)[0];
// türünü yazdırıyoruz
document.write(nodeElement.nodeType);
document.write(nodeText.nodeValue);
document.write(nodeElement.nodeName);
document.write(“<br />”);
// ilk a düğümünün alt düğümünü çekiyoruz.
var nodeText = document.getElementById(‘myDiv’).getElementsByTagName(‘a’)[0].childNodes[0];
// türünü yazdırıyoruz
document.write(nodeText.nodeType);
document.write(nodeText.nodeValue);
</script>

Çıktı:

1
3

Kategori: Document Object Model.
Etiketler:

childNodes Özelliği

Nis 10th, 2007
yazar Zihni.
Henüz yorum yok

Sözdizimi:
var nodeList = elementNodeReference.childNodes

Bir düğümün içindeki alt düğümlere ulaşmak için kullanılır.

Aşağıdaki gibi bir belgemiz olsun.

<html>
<head>
</head>
<body>
<div id=”myDiv”>
<a href=”http://www.norahjones.com”>Norah Jones</a>
<a href=”http://www.lizzwright.com”>Lizz Wright</a>
</div>
</body>
</html>

myDiv tagındaki alt düğüm içeriklerini yazdıran kod

<script type=”text/javascript”>
// div etiketinin içindeki elemetleri çekiyoruz
var nodeList = document.getElementById(‘myDiv’).childNodes;
for(i=0; i < nodeList.length; i++)
{
// alt düğümü varsa
if(nodeList[i].hasChildNodes()){
//element içeriğini yazdırıyoruz
document.write(nodeList[i]);
document.write(“<br />”);
}
}
</script>

http://www.norahjones.com/

http://www.lizzwright.com/

Kategori: Document Object Model.
Etiketler:

appendChild() Metodu

Nis 10th, 2007
yazar Zihni.
Henüz yorum yok

Sözdizimi:

element.appendChild(child);

Düğümün en sonuna yeni bir düğüm ekler.

element : üst(parent) elementin adıdır.
child : eklenecek elementin adıdır.

Aşağıdaki gibi bir belgemiz olsun.
<html>
<head>
</head>
<body>
<div id=”myDiv”>
<span>Faust</span><br />
<span>Vadideki Zambak</span> <br />
</div>
</body>
</html>

myDiv etiketinin içine span etiketini ekleyen ve içeriğini “Şu çılgın Türkler” yapan kod.

<script type="text/javascript">
var x = document.getElementById("myDiv");
// yeni bir span etiketi yaratıyoruz
var yeniSpan = document.createElement("span");
// içeriğini Şu çılgın Türkler verisi ile dolduruyoruz
var yeniSpanText = document.createTextNode("Şu çılgın Türkler");
yeniSpan.appendChild(yeniSpanText);
// myDiv etiketinin en sonuna ekliyoruz
x.appendChild(yeniSpan);
</script>

Kategori: Document Object Model.
Etiketler:

push() Metodu

Nis 8th, 2007
yazar Zihni.
Henüz yorum yok

Sözdizimi:

push(element1, …, elementN)

Push metodu ile dizilerin sonuna bir veya daha fazla eleman ekleriz, dizinin yeni uzunluğunu döndürür.

Aşağıdaki örnekte iki elemana sahip bir dizi yaratıyoruz. Daha sonra push metodu ile dizinin sonuna bir eleman daha ekliyoruz, son durumda dizimizin elaman sayisi 3 oldu.

myFavoriteActress = new array(2);
myFavoriteActress[0] = “Angelina Jolie”;
myFavoriteActress[1] = “Cameron Diaz”;
document.write(myFavoriteActress + “<br />”)
document.write(myFavoriteActress.push(”Mischa Barton”)+ “<br />”);
document.write(myFavoriteActress)
Çıktı:
Angelina Jolie,Cameron Diaz
3
Angelina Jolie,Cameron Diaz,Mischa Barton

Kategori: Javascript.
Etiketler:

 Sayfalar:  1  ... Önceki 13  14  15  16  17 Sonraki ...  20