Externí .js soubor. – JavaScript, AJAX, jQuery – Fórum – Programujte.com
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu

Externí .js soubor. – JavaScript, AJAX, jQuery – Fórum – Programujte.comExterní .js soubor. – JavaScript, AJAX, jQuery – Fórum – Programujte.com

 
Hledat
Vybavení pro Laser Game
Spuštěn Filmový magazín
Laser Game Brno
Pergoly a střechy Brno

Montezo
~ Anonymní uživatel
42 příspěvků
19. 11. 2021   #1
-
0
-

Zdravím, mám .html dokument:

<!DOCTYPE html>
<html lang="cs">
    <head>
        <title>Editor tabulek 19.11.2021</title>
        <meta charset="utf-8" />
        <script src="editor-tabulek.js"></script>
        <link rel="nofollow" href="editor-tabulek.css" rel="stylesheet" />
    </head>
    <body>

    </body>
</html>

A k tomu .js soubor (níže). .css soubor tu uvádět nebudu, je to zbytečné. A Chrome mi (když si otevřu konzoli přes F12) vypíše kupu chyb, a já už nevím, jak je pořašit:

Chyby: Uncaught TypeError: Cannot read properties of null (reading 'appendChild')
at vytvorTlacitkoAVlozHo (editor-tabulek.js:35)
at editor-tabulek.js:82

Detaily: Na tom 35. řádku je " rodic.appendChild(btn);" a na tom 82. je toto: " function pridejRadekDolu() {
let radek = vytvorRadek();
let indexVybraneho = indexRadkuAktivniBunky();
if (tabulka.lastChild == tabulka.childNodes[indexVybraneho]) {
tabulka.appendChild(radek);
} else {
tabulka.insertBefore(radek, tabulka.childNodes[indexVybraneho + 1]);
} "

Je škoda, že z těch hlášek o chybám člověk nevydedukuje, v čem ten problém je.    

Nahlásit jako SPAM
IP: 178.255.168.–
Montezo
~ Anonymní uživatel
42 příspěvků
19. 11. 2021   #2
-
0
-

.js pro přehlednost separé. 

let tabulka;
let vychoziVelikostX = 5;
let vychoziVelikostY = 3;
let aktivniBunka;

function vytvorBunku() {
    let td = document.createElement("td");

    let tdInput = document.createElement("input");

    tdInput.type = "text";
    tdInput.onfocus = function () {
        aktivniBunka = this;
    }
    td.appendChild(tdInput);

    return td;
}
function vytvorVychoziTabulku() {
    tabulka = document.createElement("table");
    document.body.appendChild(tabulka);
    for (let y = 0; y < vychoziVelikostY; y++) {
        let tr = document.createElement("tr");
        tabulka.appendChild(tr);

        for (let x = 0; x < vychoziVelikostX; x++) {
            tr.appendChild(vytvorBunku());
        }
    }
}

function vytvorTlacitkoAVlozHo(popisek, rodic) {
    let btn = document.createElement("button");
    btn.textContent = popisek;
    rodic.appendChild(btn);
    return btn;
}
function vytvorOvladaciTlacitka() {
    vytvorTlacitkoAVlozHo("Přidat ř.dolů", document.body);
    vytvorTlacitkoAVlozHo("Přidat ř.nahoru", document.body);
    vytvorTlacitkoAVlozHo("Přidat s. vlevo", document.body);
    vytvorTlacitkoAVlozHo("Přidat s. vpravo", document.body);
    vytvorTlacitkoAVlozHo("Odstranit ř.", document.body);
    vytvorTlacitkoAVlozHo("Odstranit s.", document.body);
}
window.onload = function () {
    vytvorOvladaciTlacitka();
    vytvorVychoziTabulku();
}
function vytvorRadek() {
    let novyRadek = document.createElement("tr");

    for (let i = 0; i < tabulka.firstElementChild.childNodes.length; i++) {
        novyRadek.appendChild(vytvorBunku());
    }
    return novyRadek;
}
/*
 * table = <TABLE>
 * table.firstElementChild = <TR>
 * table.firstElementChild.childNodes = [<TD>]
 * table.firstElementChild.childNodes.length = number
 *
 * table.   firstElementChild.  childNodes  .length
 * <TABLE>. <TR>.           [<TD>]      .length
 */
function indexRadkuAktivniBunky() {
    let cilHledani = tabulka.childNodes;
    let hledanyPrvek = aktivniBunka.parentElement.parentElement;
    return Array.prototype.indexOf.call(cilHledani, hledanyPrvek);
}
function indexSloupceAktivniBunky() {
    let bunkyVRadku = aktivniBunka.parentElement.parentElement.childNodes;
    let td = aktivniBunka.parentElement;
    return Array.prototype.indexOf.call(bunkyVRadku, td);
}
function pridejRadekNahoru() {
    let radek = vytvorRadek();
    let indexVybraneho = indexRadkuAktivniBunky();
    tabulka.insertBefore(radek, tabulka.childNodes[indexVybraneho]);
}
vytvorTlacitkoAVlozHo("Přidat ř. nahoru", document.body).onclick = pridejRadekNahoru;
function pridejRadekDolu() {
    let radek = vytvorRadek();
    let indexVybraneho = indexRadkuAktivniBunky();
    if (tabulka.lastChild == tabulka.childNodes[indexVybraneho]) {
        tabulka.appendChild(radek);
    } else {
        tabulka.insertBefore(radek, tabulka.childNodes[indexVybraneho + 1]);
    }
}
vytvorTlacitkoAVlozHo("Přidat ř. dolů", document.body).onclick = pridejRadekDolu;
function pridejSloupecDoleva() {
    let indexVybraneho = indexSloupceAktivniBunky();
    for (let i = 0; i < tabulka.childNodes.length; i++) {
        tabulka.childNodes[i].insertBefore(vytvorBunku(), tabulka.childNodes[i].childNodes[indexVybraneho]);
    }
}
function pridejSloupecDoprava() {
    let indexVybraneho = indexSloupceAktivniBunky();
    for (let i = 0; i < tabulka.childNodes.length; i++) {
        if (tabulka.childNodes[i].childNodes[indexVybraneho] == tabulka.childNodes[i].lastElementChild) {
            tabulka.childNodes[i].appendChild(vytvorBunku());
        } else {
            tabulka.childNodes[i].insertBefore(vytvorBunku(), tabulka.childNodes[i].childNodes[indexVybraneho + 1]);
        }
    }
}
vytvorTlacitkoAVlozHo("Přidat s. vlevo", document.body).onclick = pridejSloupecDoleva;
vytvorTlacitkoAVlozHo("Přidat s. vpravo", document.body).onclick = pridejSloupecDoprava;
function smazRadek() {
    let indexVybraneho = indexRadkuAktivniBunky();
    tabulka.removeChild(tabulka.childNodes[indexVybraneho]);
}
function smazSloupec() {
    let indexVybraneho = indexSloupceAktivniBunky();
    for (let i = 0; i < tabulka.childNodes.length; i++) {
        tabulka.childNodes[i].removeChild(tabulka.childNodes[i].childNodes[indexVybraneho]);
    }
}
vytvorTlacitkoAVlozHo("Odstranit ř.", document.body).onclick = smazRadek;
vytvorTlacitkoAVlozHo("Odstranit s.", document.body).onclick = smazSloupec;

Nahlásit jako SPAM
IP: 178.255.168.–
gna
~ Anonymní uživatel
1544 příspěvků
20. 11. 2021   #3
-
0
-

 Ten skript se spouští před definicí elementu body, takže document.body a pak parametr rodic je null.

editor-tabulek.sj:82:vytvorTlacitkoAVlozHo("Přidat ř. nahoru", document.body).onclick = pridejRadekNahoru;

editor-tabulek.sj:32:function vytvorTlacitkoAVlozHo(popisek, rodic) {
editor-tabulek.sj:33:    let btn = document.createElement("button");
editor-tabulek.sj:34:    btn.textContent = popisek;
editor-tabulek.sj:35:    rodic.appendChild(btn);
Nahlásit jako SPAM
IP: 213.211.51.–
Zjistit počet nových příspěvků

Přidej příspěvek

×Vložení zdrojáku

×Vložení obrázku

Vložit URL obrázku Vybrat obrázek na disku
Vlož URL adresu obrázku:
Klikni a vyber obrázek z počítače:

×Vložení videa

Aktuálně jsou podporována videa ze serverů YouTube, Vimeo a Dailymotion.
×
 
Podporujeme Gravatara.
Zadej URL adresu Avatara (40 x 40 px) nebo emailovou adresu pro použití Gravatara.
Email nikam neukládáme, po získání Gravatara je zahozen.
-
Pravidla pro psaní příspěvků, používej diakritiku. ENTER pro nový odstavec, SHIFT + ENTER pro nový řádek.
Sledovat nové příspěvky (pouze pro přihlášené)
Sleduj vlákno a v případě přidání nového příspěvku o tom budeš vědět mezi prvními.
Reaguješ na příspěvek:

Uživatelé prohlížející si toto vlákno

Uživatelé on-line: 0 registrovaných, 4 hosté

Podobná vlákna

SOUBOR.BAT&gt;SOUBOR.EXE — založil wokena

Externí RAM — založil yaqwsx

 

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032021 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý