Nis 10th, 2007
yazar Zihni.
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; |
Nis 10th, 2007
yazar Zihni.
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
Nis 10th, 2007
yazar Zihni.
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/
Nis 10th, 2007
yazar Zihni.
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>
Mar 10th, 2007
yazar Zihni.
Sözdizimi:
elements = element.getElementsByTagName(tagName)
tagName parametresi ile verilen elementin adına göre geriye bir element listesi -nodeList- döndürür.
Aşağıdaki gibi bir belgemiz olsun.
1
2
3
| <div id="myDiv">
<a href="http://www.norahjones.com">Norah Jones</a>
<a href="http://www.braziliangirls.com">Brazilian girls</a></div> |
myDiv tagındaki element sayısını bulalım ve bu elemanları yazdıralım.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
| <script type="text/javascript">
// elemanları çekiyoruz
var nodeList = document.getElementById('myDiv').getElementsByTagName('a');
// element -a tagı sayısı - sayısını yazdırıyoruz.
document.write("<br />");
document.write(nodeList.length);
document.write("<br />");
for(i=0; i<nodeList.length;i++)
{
//veriyi yazdırıyoruz
document.write(nodeList[i].childNodes[0].nodeValue);
document.write("<br />");
}
</script>
Çıktı:
2
http://www.norahjones.com/
http://www.braziliangirls.com/ |
