JavaScriptを使用してテーブルを作成しましたが、私のCSSを使用してレンダリングしません。どうすればそれを動作させることができますか?実際に私はより多くの助けが必要です、私のアイデアは1つのボタンを持つ画面を作成し、それをクリックすると画面の一番上から始まり、画面の最後に終わる1列のテーブルが表示されるはずです。あなたはそれにテーブルとボタンの後ろのスクリーンのすべてで開いているページをクリックすると、テーブルには、スクロール可能になり、各行は、テキストの下には、no urlラインとテキスト(URLテキストを)持っているので。ボタンは常に表示されます(ただし、クリックすると消えます)。 main.jsファイルはJavaScriptを使用してJavascriptテーブルをレンダリングしていません
function makeTableHTML() {
var x = document.createElement("TABLE");
x.setAttribute("id", "myTable");
var myArray = [ [ "Name, http://www.google.com" ],
[ "Name, http://www.google.com" ] ];
var result = '<table width = "300">';
for (var i = 0; i < myArray.length; i++) {
result += "<tr><td>";
if (i < 10) {
result += "0" + i + " ";
} else {
result += i + " ";
}
result += '<a href="' + myArray[i][0] + '">';
result += myArray[i][1] + "</a>";
result += "<td></tr>";
}
result += "</table>";
document.write(result);
document.getElementById("channelsmenu").classList.toggle(result);
}
function hideTableHTML() {
var x = document.getElementById('channelsmenu');
x.style.display = 'none';
}
で、私のHTMLは
<!DOCTYPE html>
<html>
<head>
<title>5Star-IPTV</title>
<link rel="stylesheet" type="text/css" href="css/style.css" />
<script src="js/main.js"></script>
</head>
<body>
<div>
<table>
<tr>
<td>
<div id="channelsmenu" class="dropdown-content"></div>
</td>
<td class="buttons-col"><input type="image"
src="channels-menu.png" class="buttons" alt="channels menue"
onMouseOver="this.src='channels-menu-1.png'"
onMouseOut="this.src='channels-menu.png'" onclick="makeTableHTML()" /></td>
<td class="buttons-col"><input type="image"
src="return-button.png" alt="return button" class="buttons"
onMouseOver="this.src='return-button-1.png'"
onMouseOut="this.src='return-button.png'" onclick="hideTableHTML()" /></td>
</tr>
</table>
</div>
</body>
</html>
であり、これは、あなたが "目" を開き、TR」として、それを閉じてHTMLにCSS
table {
width: 100%;
border: 1px solid black;
background-color: #808080;
}
tr {
width: 100%;
align: right;
}
th, td {
text-align: right;
} background-color: #808080;
}
.buttons-col {
text-align: center;
width: 90px;
padding-top: 5px;
}
をDOMContentLoaded、あなたのCSSはどこにありますか? –
申し訳ありません私はCSSファイルに多くのクラスがあるので、私はそれについて忘れました。今すぐチェックすることができます。おかげで多く – user2074325