40. Ovládni JavaScript - Query Selector a změna textu v HTML pomocí JavaScriptu

JavaScript je programovací jazyk, díky kterému můžete vytvořit moderní webové stránky. Moderní weby se dnes tvoří pomocí HTML, CSS a JavaScriptu. Ale JavaScript není jen to. Pokud se naučíte tento programovací jazyk, tak pro vás nebude problém přejít k jakémukoli jinému programovacímu jazyku. Co se naučíte v JavaScriptu, tak využijete i v jiných jazycích. Nejdříve si ukážeme základy JavaScriptu, které jsou společné pro všechny programovací jazyky (jen se v každém jazyce malinko jinak zapisují). Ale princip je vždy stejný. Až budeme mít za sebou základy, tak se pustíme do změny HTML a CSS jazyka pomocí JavaScriptu. A tam začne pořádná zábava. Navíc, v JavaScriptu se dají programovat i hry, takže nás čeká hodně zajímavých věcí. Naučte se HTML a CSS (viz předchozí kurz na tomto kanálu) a JavaScript a budete mít otevřenou bránu na pracovní trh, kde jsou tyto znalosti dost poptávané. A co si budeme říkat, také dobře placené. Změňte svůj život vzděláním. Pojďme se naučit programovat.

[@tomasmatusek6292]

Tak tady už je to waaaw, hodně mocný s tím přepisování.

[@hacknisvoubudoucnost]

Jsem rád, že se líbí :-)

[@codecake9086]

Ahoj super video jen mam problém že mi nejde to document.querySelector("h1").textContent . v consoly mi to vyjhazuje chybu v js a nechápu proč podtržené je .textContent. Děkuji za

[@hacknisvoubudoucnost]

Ahoj, díky, jsem rád, že se ti videa líbí. Takto na dálku těžko říci. Nemáš třeba v html více h1 - zkus tam mít jen jednu. Nechybí ti na konci středník za textContent. Mě to funguje s tímto: var test = document.querySelector("h1").textContent;
console.log(test);
Zkus popř. mrknout do učebnice a porovnat kód s tím tvojím. Pokud by ti to nefungovalo, tak ještě zkontroluj propojení mezi index.html a javascriptovým souborem, ale v tom by to asi být nemělo, jestli ti předchozí věci fungovali.

[@codecake9086]

@@hacknisvoubudoucnost Děkuji za odpověď nakonec jsem na to přišel musel jsem dát ten script src soubor mezi body a html předtím jsem to měl v head ale vše běhalo v pohodě tak nevím proč tohle nešlo. Jinak moc děkuji
Jinak děkuji za novou serii oop hodně se mi tam ujasnili věci jen mam jeden dostaz někde jsem se setkal se zápisem
class Person{
constructor(name,age,job){
tihis.name = name
this.age = age
this.job =job
}}
je v tom nějaký rozdíl nebo co se více používá ??

[@hacknisvoubudoucnost]

@@codecake9086 Tak super, jsem rád, že už to funguje tak, jak má. U OOP je problém, že se dříve vyvíjel po několika větvích (proudech) a občas se můžeš setkat s různými zápisy jedné věci. Např. ve videích ukazuji dva různé zápisy pro objekt. Mě dává větší smysl zapisovat konstruktor jako ve videu, protože mi to přijde srozumitelnější. A tento způsob, co jsi napsal, jsem nikdy nepoužíval. Ale pokud ti to dává větší smysl to zapisovat takto, tak můžeš. Já se vždy setkávám se zápisem jako ve videu.

[@tomasmatusek6292]

hodne to tresta a neodpousti chyby, to se mi libi ale i desne stve, musim si tak davat pozor a vlastne se mi libi ze musim byt celkem dost pozorny a divat se co delam za chyby. V tom Console, ti to naoise jakou udelas chybu, a nebo treba co se tomu nelibi, nekdy ze to i upozorni kde presne.

[@miroslavkostros252]

a co je to v tej meta? za text?

[@hacknisvoubudoucnost]

jestli myslíš viewport, tak to souvisí s responzivitou (přizpůsobování stránky zařízením jako jsou mobily, tablety atd.). Např. že jako šířka stránky se má vzít šířka zařízení (width = device-width). Popř. více info o responzivitě je v kurzu HTML a CSS na kanálu