第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會(huì)有你想問的

如何將 CSS 添加到使用 javascript 創(chuàng)建的動(dòng)態(tài)表中

如何將 CSS 添加到使用 javascript 創(chuàng)建的動(dòng)態(tài)表中

慕碼人8056858 2023-08-18 16:32:29
基本上我在 javascript 上創(chuàng)建一個(gè)動(dòng)態(tài)表并將其顯示在 html 頁面中。我還有一個(gè)適用于靜態(tài)元素的 css 文件,但不適用于我動(dòng)態(tài)創(chuàng)建的表格。我可以做什么來設(shè)計(jì)動(dòng)態(tài)創(chuàng)建的表格的樣式?我已經(jīng)嘗試過這個(gè):table.classList.add('tablestyle');但它不起作用。正如你可以想象的那樣,我對(duì)這類事情絕對(duì)是新手。我有3個(gè)文件:reports.component.ts(包含 html。對(duì) sccs 和 js 的引用位于文件中,并且它們可以正常工作)<html><div class="block">        <h1>STORICO DEI DATI</h1>            <div id="myDynamicTable" class="table">                <body onload="Javascript:addTable()"></body>            </div>        </div></html>報(bào)告.組件.jsfunction addTable() {    let colonne = Math.floor(Math.random() * 5)+2;      let righe = Math.floor(Math.random() * 5)+2;          var today = new Date();    var dd = String(today.getDate()).padStart(2, '0');    var mm = String(today.getMonth() + 1).padStart(2, '0'); //January is 0!    var yyyy = today.getFullYear();        today = mm + '/' + dd + '/' + yyyy;        let providers = ["p1", "p2", "p3", "np4", "p5"];    let testcases = ["tc1", "tc2", "tc3", "tc4", "tc5"];              var myTableDiv = document.getElementById("myDynamicTable");          var table = document.createElement('table');    table.classList.add('tablestyle');        var tableBody = document.createElement('TBODY');    table.appendChild(tableBody);           for (var i=0; i<righe; i++){       var tr =  document.createElement('tr');       tr.style.backgroundColor = 'red';       tableBody.appendChild(tr);              for (var j=0; j<colonne; j++){           var td = document.createElement('td');           td.width='75';           if(i==0){                 if(j==0){ //prima casella                    addCell(td, tr, today);                }                else { //prima riga                    addCell(td, tr, providers[j-1]);                }           }           else {               if(j==0){ //prima colonna                    addCell(td, tr, testcases[i-1]);               }               else {                    addCell(td, tr, Math.floor(Math.random() * 50));               }report.component.scss(更長,但這是我想要工作的部分).tablestyle{  font-weight: bold;}
查看完整描述

2 回答

?
臨摹微笑

TA貢獻(xiàn)1982條經(jīng)驗(yàn) 獲得超2個(gè)贊

為您制作了一段代碼,以向您展示它的工作原理。也許您的實(shí)際樣式表存在矛盾。

請(qǐng)注意將body標(biāo)簽放置在正確的層次結(jié)構(gòu)中。

function addTable() {


? ? let colonne = Math.floor(Math.random() * 5)+2;??

? ? let righe = Math.floor(Math.random() * 5)+2;??

? ??

? ? var today = new Date();

? ? var dd = String(today.getDate()).padStart(2, '0');

? ? var mm = String(today.getMonth() + 1).padStart(2, '0'); //January is 0!

? ? var yyyy = today.getFullYear();

? ??

? ? today = mm + '/' + dd + '/' + yyyy;

? ??

? ? let providers = ["p1", "p2", "p3", "np4", "p5"];

? ? let testcases = ["tc1", "tc2", "tc3", "tc4", "tc5"];

? ??

? ? ??

? ? var myTableDiv = document.getElementById("myDynamicTable");

? ? ??

? ? var table = document.createElement('table');

? ? table.classList.add('tablestyle');

? ??

? ? var tableBody = document.createElement('TBODY');

? ? table.appendChild(tableBody);

? ?

? ??


? ? for (var i=0; i<righe; i++){

? ? ? ?var tr =? document.createElement('tr');

? ? ? ?tr.style.backgroundColor = 'red';

? ? ? ?tableBody.appendChild(tr);

? ? ? ?

? ? ? ?for (var j=0; j<colonne; j++){

? ? ? ? ? ?var td = document.createElement('td');

? ? ? ? ? ?td.width='75';


? ? ? ? ? ?if(i==0){?

? ? ? ? ? ? ? ? if(j==0){ //prima casella

? ? ? ? ? ? ? ? ? ? addCell(td, tr, today);

? ? ? ? ? ? ? ? }

? ? ? ? ? ? ? ? else { //prima riga

? ? ? ? ? ? ? ? ? ? addCell(td, tr, providers[j-1]);

? ? ? ? ? ? ? ? }

? ? ? ? ? ?}

? ? ? ? ? ?else {

? ? ? ? ? ? ? ?if(j==0){ //prima colonna

? ? ? ? ? ? ? ? ? ? addCell(td, tr, testcases[i-1]);

? ? ? ? ? ? ? ?}

? ? ? ? ? ? ? ?else {

? ? ? ? ? ? ? ? ? ? addCell(td, tr, Math.floor(Math.random() * 50));

? ? ? ? ? ? ? ?}

? ? ? ? ? ??

? ? ? ? ? ?}

? ? ? ??

? ? ? ? ??

? ? ? ?}

? ? }

? ? myTableDiv.appendChild(table);

? ??

}



function addCell(td, tr, valoreCella){

? ? td.appendChild(document.createTextNode(valoreCella));

? ? tr.appendChild(td);

}

.tablestyle{

? font-weight: bold;

? color: green

}

<body onload="addTable()">

? <div class="block">

? ? ? <h1>STORICO DEI DATI</h1>

? ? ? <div id="myDynamicTable" class="table">

? ? ? ? ? <!--JS-->

? ? ? </div>

? </div>

</body>


查看完整回答
反對(duì) 回復(fù) 2023-08-18
?
Qyouu

TA貢獻(xiàn)1786條經(jīng)驗(yàn) 獲得超11個(gè)贊

添加

table.className = 'tablestyle'

或者

table.setAttribute("class", "tablestyle");


查看完整回答
反對(duì) 回復(fù) 2023-08-18
  • 2 回答
  • 0 關(guān)注
  • 172 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)