HTML DOM ColumnGroup অবজেক্টটি HTML
সম্পত্তি
নিচের ColumnGroup সম্পত্তি −
| সম্পত্তি | বিবরণ |
|---|---|
| span | একটি কলাম গ্রুপের স্প্যান অ্যাট্রিবিউটের মান সেট করে বা ফেরত দেয় |
সিনট্যাক্স
−
-এর সিনট্যাক্স নিচে দেওয়া হলএকটি ColumnGroup অবজেক্ট তৈরি করা হচ্ছে -
var x = document.createElement("COLGROUP"); উদাহরণ
আসুন ColumnGroup অবজেক্ট -
-এর একটি উদাহরণ দেখি<!DOCTYPE html>
<html>
<head>
<style>
table, th, td {
border: 1px solid black;
}
#DIV1{
background-color:pink;
}
</style>
</head>
<body>
<table id="TABLE1">
<tr>
<th>FRUIT</th>
<th>COLOR</th>
<th>Price</th>
</tr>
<tr>
<td>MANGO</td>
<td>YELLOW</td>
<td>100RS</td>
</tr>
<tr>
<td>GUAVA</td>
<td>GREEN</td>
<td>50RS</td>
</tr>
</table>
<p>Click the below button to create a colgroup element with span = 2.</p>
<button onclick="colFun()">COLGROUP</button>
<script>
function colFun() {
var x = document.createElement("COLGROUP");
x.setAttribute("id","DIV1");
x.setAttribute("span","2");
document.getElementById("TABLE1").appendChild(x);
}
</script>
</body>
</html> আউটপুট
এটি নিম্নলিখিত আউটপুট −
তৈরি করবে
COLGROUP -
-এ ক্লিক করলে
উপরের উদাহরণে -
আমরা প্রথমে তিনটি সারি এবং তিনটি কলাম এবং "টেবিল 1" আইডি সহ একটি টেবিল তৈরি করেছি। আমরা টেবিলে কিছু শৈলী প্রয়োগ করেছি এবং এর শিশু উপাদানগুলি -
table, th, td {
border: 1px solid black;
}
<table id="TABLE1">
<tr>
<th>>FRUIT</th>
<th>COLOR</th>
<th>Price</th>
</tr>
<tr>
<td>MANGO</td>
<td>YELLOW</td>
<td>100RS</td>
</tr>
<tr>
<td>GUAVA</td>
<td>GREEN</td>
<td>50RS</td>
</tr>
</table> তারপরে আমরা COLGROUP একটি বোতাম তৈরি করেছি যা ব্যবহারকারী দ্বারা ক্লিক করার পরে colFun() কার্যকর করবে -
<button onclick="colFun()">COLGROUP</button>
colFun() পদ্ধতি একটি
