[英]How to change background color of cell in table using java script
我需要使用java腳本更改表中單個單元格的背景顏色。
在文檔中我需要所有單元格的樣式應該相同（所以使用樣式表來添加它。），但是在按鈕單擊時我需要更改第一個單元格的顏色。
以下是示例代碼
<html lang="en">
<head>
<script type="text/javascript" >
function btnClick()
{
var x = document.getElementById("mytable").cells;
x[0].innerHTML = "i want to change my cell color";
x[0].bgColor = "Yellow";
}
</script>
</head>
<style>
div
{
text-align: left;
text-indent: 0px;
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
}
td.td
{
border-width : 1px;
background-color: #99cc00;
text-align:center;
}
</style>
<body>
<div>
<table id = "mytable" width="100%" border="1" cellpadding="2" cellspacing="2" style="background-color: #ffffff;">
<tr valign="top">
<td class = "td"><br /> </td>
<td class = "td"><br /> </td>
</tr>
<tr valign="top">
<td class = "td"><br /> </td>
<td class = "td"><br /> </td>
</tr>
</table>
</div>
<input type="button" value="Click" OnClick = "btnClick()">
</body>
</html>
試試這個：
function btnClick() {
var x = document.getElementById("mytable").getElementsByTagName("td");
x[0].innerHTML = "i want to change my cell color";
x[0].style.backgroundColor = "yellow";
}
從JS設置， backgroundColor相當於樣式表中的background-color 。
另請注意， .cells集合屬於表行 ，而不屬於表本身。 要從所有行獲取所有單元格，您可以改為使用getElementsByTagName() 。
<table border="1" cellspacing="0" cellpadding= "20">
<tr>
<td id="id1" ></td>
</tr>
</table>
<script>
document.getElementById('id1').style.backgroundColor='#003F87';
</script>
將id添加到單元格，然后更改單元格的背景。
document.getElementById('id1').bgColor = '#00FF00';
似乎工作。 我不認為.style.backgroundColor 。
如何使用行號和列號在java腳本中更改表格單元格的背景顏色？
[英]How to change background color of a table cell in java script using row and column number?
如果單元格內容匹配，如何使用javascript更改表格中單元格的背景顏色
[英]How to change background color of cell in table using javascript if cell content match
使用JavaScript根據JSON值更改表格單元格背景色
[英]Using javascript to change table cell background color based on json value
使用 javascript 根據用戶輸入更改表格單元格背景顏色
[英]change table cell background color according to user input using javascript
如何使用 javascript 更改 HTML 表格單元格的背景顏色？
[英]How do I change the background color of an HTML table cell with javascript?
如何使用angularjs根據各個單元格數據更改表格行的背景顏色？
[英]How to change Background color of table row based on respective cell data using angularjs?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.