JavaScript [MK, 20/21]
Lekcja 8. Funkcje matematyczne   Instrukcje warunkowe

Funkcje tekstowe

Wybrane funkcje tekstowe dostępne w JavaScript

  • length – zwraca długość tekstu (nie jest to funkcja)
  • slice(), substring(), substr() – pozwalają wybrać fragment tekstu z całości
  • replace(), replaceAll() – pozwalają zastąpić jeden tekst innym
  • toLowerCase(), toUpperCase() – zmiana wielkości znaków
  • concat() – łączenie tekstów
  • padStart(), padEnd() – uzupełnianie tekstu innymi znakami do określonej długości
  • split() – przekształca tekst na tablicę znaków, tzn. umieszcza każdy znak w jednej komórce tablicy

Zadania

Zadanie 1. #
Utwórz plik wlasnosc_lenght.html zawierający dwa akapity oraz przycisk. Pierwszy akapit ma zawierać tekst Jan Chryzostom Pasek z Gosławic herbu Doliwa, drugi akapit ma być pusty, a przycisk ma być opisany informacją Policz znaki. Po naciśnięciu przycisku, policz znaki w pierwszym akapicie i wyświetl je w drugim, np.: Tekst powyżej ma długość _ znaków. Dodatkowo ten drugi tekst ma mieć tło w kolorze #ffdfd3 i margines wewnętrzny o szerokości 5 pikseli.

Zadanie 2. #

Utwórz plik funkcja_slice.html zawierający trzy akapity oraz dwa przyciski. Pierwszy akapit ma zawierać tekst Mikołaj Kopernik – polski polihistor pochodzenia niemieckiego, drugi i trzeci mają być puste. Przyciski mają być opisane informacjami: Wytnij znaki od 26 do 36 i Wytnij znaki od końca: od 5 do 12.

Po naciśnięciu pierwszego przycisku, wytnij z tekstu słowo polihistor i umieść je w drugim akapicie. Dodatkowo ustaw mu czcionkę wielkości 30 px, pogrubioną oraz dodaj do tekstu cień w kolorze czerwonym, z przesunięciem na osi X i Y o 3 piksele i z rozmyciem o promieniu 5 pikseli.

Po naciśnięciu drugiego przycisku, wytnij z tekstu słowo niemiec i umieść je w trzecim akapicie. Dodatkowo ustaw mu czcionkę wielkości 30 px, pochyloną oraz dodaj do tekstu cień w kolorze niebieskim, z przesunięciem na osi X i Y o 2 piksele.

Zadanie 3. #

Utwórz plik funkcja_substring.html zawierający trzy akapity oraz dwa przyciski. Pierwszy akapit ma zawierać tekst Fryderyk Franciszek Chopin – polski kompozytor i pianista, drugi i trzeci mają być puste. Przyciski mają być opisane informacjami: Wytnij znaki od 9 do 19 i Wytnij znaki od 27 do końca.

Po naciśnięciu pierwszego przycisku, wytnij z tekstu słowo Franciszek i umieść je w drugim akapicie. Dodatkowo nadaj mu ramkę w kolorze crimson i margines wewnętrzny o szerokości 8 pikseli.

Po naciśnięciu drugiego przycisku, wytnij z tekstu znaki od 27-go do końca i umieść je w trzecim akapicie. Dodatkowo nadaj mu ramkę w kolorze crimson i margines wewnętrzny o szerokości 8 pikseli.

Zadanie 4. #

Utwórz plik funkcja_substr.html zawierający trzy akapity oraz dwa przyciski. Pierwszy akapit ma zawierać tekst Mieszko I – władca Polski z dynastii Piastów, drugi i trzeci mają być puste. Przyciski mają być opisane informacjami: Wytnij znaki od 27 do 36 i Wytnij znaki od 37 do końca.

Po naciśnięciu pierwszego przycisku, wytnij z tekstu słowo dynastii i umieść je w drugim akapicie. Dodatkowo nadaj mu żółty kolor czcionki, kolor tła dodgerblue i margines wewnętrzny o szerokości 5 pikseli.

Po naciśnięciu drugiego przycisku, wytnij z tekstu słowo Piastów i umieść je w trzecim akapicie. Dodatkowo nadaj mu żółty kolor czcionki, kolor tła tomato i margines wewnętrzny o szerokości 5 pikseli.

Zadanie 5. #

Utwórz plik funkcja_replace.html zawierający jeden akapit oraz dwa przyciski, jeden pod drugim. Akapit ma zawierać tekst Microsoft Edge – przeglądarka internetowa firmy Microsoft, przyciski mają być opisane tekstem: Zastąp słowo 'Edge' słowem 'Janusz Explorer' i Zastąp każde słowo 'Microsoft' słowem 'JanuszPol. Po naciśnięciu pierwszego lub drugiego przycisku, zmodyfikuj tekst w akapicie zgodnie z opisem.

Zadanie 6. #

Utwórz plik funkcja_upper_lower.html zawierający jeden akapit oraz trzy przyciski, jeden pod drugim. Akapit ma zawierać tekst Euklides z Aleksandrii (stgr. Εὐκλείδης) – grecki matematyk, przyciski mają być opisane tekstami: Zmień wszystkie litery na wielkie, Zmień wszystkie litery na małe i Przywróć początkową wielkość znaków. Po naciśnięciu dowolnego przycisku, zmodyfikuj tekst w akapicie zgodnie z opisem.

Zadanie 7. #

Utwórz plik funkcja_concat.html zawierający jeden akapit i jeden przycisk. Akapit ma zawierać tekst Czuwaj, a przycisk mają być opisany informacją: Doklej wykrzyknik (!) na końcu tekstu.

Po każdorazowym naciśnięciu przycisku, na końcu tekstu w akapicie ma być dodawany nowy wykrzyknik.

Zadanie 8. #

Utwórz plik funkcja_padstart_padend.html zawierający jeden akapit oraz dwa przyciski, jeden pod drugim. Akapit ma zawierać tekst Stefan Banach, przyciski mają być opisane tekstami: Wypełnij tekst na początku podkreśleniami, aby miał długość 20 znaków i Wypełnij tekst na końcu kropkami, aby miał długość 30 znaków. Po naciśnięciu dowolnego przycisku, użyj funkcji padStart() lub padEnd() i zmodyfikuj tekst w akapicie zgodnie z opisem.

Zadanie 9. #

Utwórz plik funkcja_split.html zawierający jeden akapit oraz jednej przycisk. Akapit ma zawierać jednocyfrowe liczby ciągu Fibonacciego, oddzielone pionową linią: 0|1|1|2|3|5|8. Przycisk ma zawierać tekst: Utwórz tablicę liczb i wyświetl ją w konsoli. Po naciśnięciu przycisku, użyj funkcji split(), utwórz tablicę znaków i wyświetl ją w konsoli przeglądarki.

2023-11-01 18:17:12 2023-11-05 22:42:08


© 2024 Młody Informatyk v. 0.1.7717