Witaj

Witaj

Witaj

DOM - Documnent Object Model

Demonstacja działania selektorów



Otwórz w trybie kompatybilności.

Kod

<!DOCTYPE html>
<html lang="pl">
<head>
    <meta charset="UTF-8">
    <style>
        .red{
            color:blueviolet
        }
    </style>
</head>
<body>
    <h1 class="red">Witaj</h1>
    <hr>
    <p id="uno">Wit<strong>aj</strong></p>
    <p id="duo">Wit<strong>aj</strong></p>
    <p>DOM - Documnent Object Model</p>
    <p class="czerwony">Demonstacja działania <b>selektorów</b></p>
    <p id="demo"></p>
    <input type="text" id="imie" value="ala">
    <br>
    <input type="number" id="liczba2" placeholder="wpisz kod pocztowy">
    <br>
    <img id="obrazek" src="https://picsum.photos/200/300">
    <script>
        let y = document.getElementById("demo")
        let y1 = document.querySelector("#demo")
        let x = document.getElementsByTagName("img")
        let x1 = document.querySelectorAll("p")
        let x2 = document.querySelectorAll(".red")
        y.innerHTML = 'piewrwszy akapit to: ' + x1[0].innerHTML
        //innerHTML//innerText - zeminna/czyta konteskst wybranego elementu z DOM
        let imie = document.getElementById("imie").value
        //value - zmiana/odzczyt wartości
        alert(imie)
        y.style.color = "blue"
        y.style.fontSize = "1.5rem"
        let z = document.getElementById("obrazek")
        // z.src = "https://picsum.photos/200/300"
        // np. src =- zmaina
    </script>
</body>
</html>