Allora... intanto ringrazio per la pazienza e per il supporto puntuale, preciso e super dettagliato.

Studierò per bene il metodo perchè all'esame ovviamente devo dare conto di quanto ho inserito nel codice.
Riferendomi anche ai suggerimenti ricevuti QUI mi sa che resto sul codice precedente non responsive perchè le novità inserite e i concetti sono troppi e ho paura di non saperli padroneggiare al meglio.

A tale proposito faccio ancora una domanda, stavolta di javascript, e perciò inserisco la inserisco in quësto thread:

Come si vede nel codice che ho postato nel primo post del thread, nella parte finale dove ho inserito il codice:

codice:
/*divisione di ogni dato array in 3 parti ProgrammaNome, ProgrammaUrl e datoClasse */
d3.csv("Palinsesto.csv", function (datiCaricati) {
    console.log(datiCaricati);
    var d = datiCaricati;
    d3.select("tbody")
        .append("tr")
        .selectAll("td")
        .data([d.dalle, d.alle, d.LUNEDI, d.dalle, d.alle, d.MARTEDI, d.dalle, d.alle, d.MERCOLEDI, 
               d.dalle, d.alle, d.GIOVEDI, d.dalle, d.alle, d.VENERDI, d.dalle, d.alle, d.SABATO, 
               d.dalle, d.alle, d.DOMENICA])
        .enter()
        .append("td")
        .attr("class",function(d){
            const [Pippo, Pluto, Topolino] = d.split("|");    
            return Topolino;
            })
        .html(function (cella) {
                const [ProgrammaNome, ProgrammaUrl, classeCella] = cella.split("|");
                /* se la cella ha il valore dell'url, inserisco un link */
                if (ProgrammaUrl) {
                   return "<a href='" + ProgrammaUrl + "' target='blank' \">" + ProgrammaNome + "</a>"
                }
                /* altrimenti mostro un testo normale */
                /*Se non ci fosse le colonne "dalle" e "alle" non verrebbero visualizzate */
                else {
                    return ProgrammaNome
                }
              }
             )

ho usato due volte lo split per ricavare, la prima volta la classe da attribuire ad ogni singolo <td>
codice:
.append("td")
        .attr("class",function(d){
            const [Pippo, Pluto, Topolino] = d.split("|");    
            return Topolino;
            })

e poi quando dovevo costruire il link nel <td> assegnando alle variabili ProgrammaNome e ProgrammaUrl rispettivamente il primo spezzone di testo ricavato dal file .csv e il secondo (il terzo è coem visto sopra inerente la classe CSS da assegnare al <td>)

codice:
.html(function (cella) {
                const [ProgrammaNome, ProgrammaUrl, classeCella] = cella.split("|");
                /* se la cella ha il valore dell'url, inserisco un link */
                if (ProgrammaUrl) {
                   return "<a href='" + ProgrammaUrl + "' target='blank' \">" + ProgrammaNome + "</a>"
                }
                /* altrimenti mostro un testo normale */
                /*Se non ci fosse le colonne "dalle" e "alle" non verrebbero visualizzate */
                else {
                    return ProgrammaNome
                }
              }
             )

Orbene: la mia domanda è: posso inserire più sopra lo split in modo da ricavare ProgrammaNome, ProgrammaUrl e classeCella (Topolino nel primo split) in modo da usarli successivamente nell'assegnazione della classe CSS al <td> prima e poi nela costruzione del link ivi contenuto?
In altre parole... i due split fanno la stessa cosa; posso farne uno solo?