Kwalifikacje w Zawodzie - Testy zawodowe online | Egzaminy Zawodowe

KWALIFIKACJA INF3 - CZERWIEC 2015



PYTANIE NR 35.
Wskaż rezultat działania fragmentu kodu JavaScript.
Ilustracja przedstawia fragment kodu JavaScript, który jest częścią pytania egzaminacyjnego związanego z kwalifikacją
A.
B.
C.
D.
Wyjaśnienie poprawnej odpowiedzi:
Odpowiedź "Dodanie akapitu na koniec strony." opisuje typowy efekt użycia operacji DOM polegających na utworzeniu elementu (np. <p>) i dołączeniu go do istniejącego kontenera na końcu listy dzieci.
Takie działanie nie usuwa elementów ani nie wyświetla okna dialogowego.

Pełne wyjaśnienie:

W zadaniach tego typu ocenia się umiejętność przewidzenia skutku działania kodu JavaScript manipulującego drzewem DOM. Rezultat "Dodanie akapitu na koniec strony." jest zgodny z sytuacją, gdy skrypt:

  • tworzy nowy element akapitu (np. poprzez utworzenie węzła odpowiadającego <p>),
  • ustawia jego treść (np. tekst "akapit"),
  • a następnie dołącza go do istniejącego elementu dokumentu na końcu (np. do <body> lub innego kontenera) metodą, która dopisuje dziecko jako ostatnie.

Dlaczego pozostałe odpowiedzi nie pasują do takiego działania?

  • "Usunięcie akapitu ze strony." wymagałoby użycia operacji usuwania węzła (np. wywołania usunięcia elementu) albo nadpisania zawartości kontenera. Samo tworzenie i dołączanie nowego węzła nie usuwa istniejących akapitów.
  • "Dodanie akapitu na początku strony." odpowiadałoby użyciu mechanizmu wstawienia przed pierwszym dzieckiem (np. wstawianie na początek kontenera). To inny efekt niż dopisanie na końcu.
  • "Wyświetlenie okna dialogowego z napisem akapit." wymagałoby jawnego wywołania funkcji prezentującej dialog (np. alert lub podobnej). Manipulacja DOM nie powoduje automatycznie pojawienia się okna dialogowego.

Wskazówka egzaminacyjna: zawsze rozdziel dwie kwestie: co jest tworzone (np. element akapitu) oraz gdzie jest wstawiane (początek czy koniec kontenera). To "gdzie" zwykle rozstrzyga między podobnymi odpowiedziami.

Dodatkowe pytania

Dodatkowe pytania (FAQ):
Co to jest DOM w JavaScript i po co się go używa?
DOM (Document Object Model) to reprezentacja strony jako drzewa obiektów. JavaScript może przez DOM tworzyć, usuwać i modyfikować elementy HTML w czasie działania, np. dopisać nowy akapit do treści bez przeładowania strony.
Jak dodać element <p> na koniec strony w JavaScript?
Najczęściej tworzy się element i dopina do kontenera: tworzysz węzeł akapitu, ustawiasz tekst, a potem dołączasz go jako ostatnie dziecko (np. do body). Efekt to nowy akapit na końcu zawartości kontenera.
Dlaczego appendChild dodaje element na końcu, a nie na początku?
Metoda dopisuje węzeł jako ostatnie dziecko wskazanego rodzica. Nie wybiera pozycji "0", tylko zawsze dokłada na koniec listy dzieci. Wstawianie na początek wymaga innej operacji, np. wstawienia przed pierwszym dzieckiem.
Jakie są różnice między appendChild a insertBefore?
appendChild dopina element na końcu. insertBefore pozwala wstawić element przed wskazanym węzłem, więc można dodać go na początek lub w środek listy dzieci. Na egzaminie różnica "koniec vs początek" bywa kluczowa.
Czy dodanie akapitu zawsze oznacza wyświetlenie tekstu na ekranie?
Jeśli akapit zostanie dołączony do DOM w widocznej części dokumentu (np. w body), to przeglądarka go wyrenderuje. Samo utworzenie elementu bez dołączenia do DOM nie pokaże go użytkownikowi.
Kiedy w kodzie pojawi się okno dialogowe alert?
Okno dialogowe pojawia się tylko po wywołaniu funkcji do tego przeznaczonej, np. alert(...). Operacje DOM, takie jak tworzenie i wstawianie elementów, nie wyświetlają dialogów automatycznie.
Co jest najczęstszą pułapką w zadaniach o rezultacie działania kodu JS?
Często myli się miejsce wstawienia (początek/koniec) albo zakłada, że "dodanie" zmienia istniejący element, zamiast dodać nowy. Pomaga śledzenie: jaki jest rodzic oraz jakiej metody wstawiania użyto.
Jak rozpoznać w kodzie, że element jest usuwany z DOM?
Usuwanie zwykle widać po operacjach kasowania węzłów (np. wywołaniu metody usunięcia) albo po nadpisaniu zawartości kontenera. Jeżeli kod tylko tworzy element i go dołącza, to nie jest to usunięcie.
Jak sprawdzić, gdzie dokładnie zostanie dodany nowy element na stronie?
Trzeba ustalić, do jakiego rodzica element jest dodawany (np. body, div o danym identyfikatorze) oraz jaką metodą: dopięcie na końcu, wstawienie przed pierwszym dzieckiem albo przed wskazanym węzłem. To determinuje pozycję w dokumencie.
Jak przygotować się do zadań INF.3 z manipulacji DOM?
Przećwicz krótkie przykłady: dodawanie elementów na koniec i na początek, podmianę tekstu, usuwanie węzłów oraz reagowanie na kliknięcia. Warto też umieć "na sucho" prześledzić kod i przewidzieć zmianę w strukturze HTML.
info

Statystycznie 45% uczniów zna prawidłową odpowiedź. trudne

Źródła:

  • MDN Web Docs: Document.createElement() - https://developer.mozilla.org/en-US/docs/Web/API/Document/createElement (dostęp: 2026-03-01)
  • MDN Web Docs: Node.appendChild() - https://developer.mozilla.org/en-US/docs/Web/API/Node/appendChild (dostęp: 2026-03-01)
  • MDN Web Docs: Node.insertBefore() - https://developer.mozilla.org/en-US/docs/Web/API/Node/insertBefore (dostęp: 2026-03-01)

Materiały:

  • Dokumentacja MDN dotycząca DOM (createElement, appendChild, insertBefore)
  • Ćwiczenia praktyczne: tworzenie elementów i wstawianie ich w różne miejsca drzewa DOM
  • Powtórka z selektorów i pobierania elementów (querySelector, getElementById)
Zobacz też:

Aktualizacja pytania: 31.03.2026



Aktualizacja pytania: 31.03.2026
📡 Brak połączenia internetowego