Các lượt nộp
    Danh sách bài
    Trang chủ
    Báo lỗi
    solution
    Đăng nhập
    Đăng nhập

    Đề bài: [Thiết kế Web] Đường lan truyền sự kiện

    📖Cần ôn lý thuyết? Đọc bài giảng Buổi 12: JavaScript cho Website (1): window, document, sự kiện, DOM — khóa Thiết kế Web

    Mô phỏng đường đi của một sự kiện DOM khi được kích hoạt tại một nút đích (target). Sự kiện đi qua hai giai đoạn: giai đoạn CAPTURE (đi từ nút gốc xuống dần tới target) và giai đoạn BUBBLE (đi từ target lên dần tới nút gốc). Cho cây DOM và chỉ số nút target, hãy in ra hai đường đi đó.

    • Định dạng đầu vào:

      Dòng đầu là số nguyên n (số nút trong cây, 1 ≤ n ≤ 200). n dòng tiếp theo, dòng thứ i (1 ≤ i ≤ n) mô tả nút có chỉ số i theo cú pháp: "parentIdx tagName classes attrs"

      • parentIdx: chỉ số nút cha (0 nếu là nút gốc; nút gốc luôn có chỉ số 1). Nút cha luôn có chỉ số nhỏ hơn nút con (dữ liệu được cho theo thứ tự tạo/duyệt, đúng thứ tự các nút con được thêm vào — coi đây là thứ tự anh em trong cây).
      • tagName: tên thẻ HTML (chữ thường, không khoảng trắng).
      • classes: danh sách class cách nhau bởi dấu phẩy (không khoảng trắng), hoặc "-" nếu không có class.
      • attrs: danh sách cặp "tên=giá_trị" cách nhau bởi dấu chấm phẩy (không khoảng trắng), hoặc "-" nếu không có thuộc tính nào (giá trị không chứa dấu chấm phẩy hay khoảng trắng). Dòng cuối: chỉ số nút target.
    • Ràng buộc đầu vào:

      1 ≤ n ≤ 200.

    • Định dạng đầu ra:

      In ra hai dòng: Dòng 1: tên các thẻ theo thứ tự CAPTURE (từ gốc tới target), nối bằng dấu phẩy. Dòng 2: tên các thẻ theo thứ tự BUBBLE (từ target tới gốc), nối bằng dấu phẩy.

    Ví dụ:

    Đầu vào:

    4
    0 div - -
    1 p - -
    1 span - -
    2 b - -
    4
    

    Đầu ra:

    div,p,b
    b,p,div

    Chủ đề

    🌐 Thiết kế WebThiết kế WebThiết kế Web: DOM — Truy vấn & Thao tácTất cả môn học

    Đang tải editor...