jQuery ile Tablo Oluşturma Örneği

sdkbyrm

olwα.ɴeт
Üyelik Tarihi
23 Aralık 2020
Mesajlar
813
Beğeniler
1
Puanı
3
Ticaret: 0 / 0 / 0
Bu örneğimizde jQuery ile HTML tablo oluşturacağız. Örneğimizde sayfamızın tamamını kaplayan 10 satır ve 10 sütundan oluşan bir tablo oluşturarak içine çarpım tablosu ekleyeceğiz. Ayrıca tablo kenarlık rengi ve kenarlık kalınlığı gibi özelliklerinde jQuery kodları ile nasıl değiştirilebileceğini görebilirsiniz.


Kodlar:


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36

<html>
<head>
<title>www.yazilimkodlama.com</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
<script>
$(document).ready(function(){
// yazilimkodlama.com
var tablo = $("<table>", {
border: 3,
width: "100%",
borderColor:"red"
});
var x,y;

var satir,sutun;

for (x=1;x<=10;x++)
{
satir=$('<tr>');
for (y=1;y<=10;y++)
{
sutun=$('<td>');
sutun.append((y)+' x '+(x)+' = '+(x)*(y) );
satir.append(sutun);
tablo.append(satir);
}
}
$('body').append(tablo);
});
</script>
</body>
</html>
Ekran Çıktısı:

 
Üst Alt