Menu
Coddy logo textTech

יצירת הענן

שיעור 7 מתוך 18 בקורס עננים נעים - פרויקט HTML/CSS/JS של Coddy.

נזכיר בקצרה כיצד לתפעל רכיבי DOM באמצעות JS.

כדי לקבל רכיבים לפי שם מחלקה, השתמשו ב-document.getElementsByClassName:

const elements = document.getElementsByClassName("someName");

הקוד שלמעלה יקבל מערך של כל הרכיבים במסמך ששם המחלקה שלהם הוא "someName".

כדי לשנות את הסגנון של רכיב, השתמשו במאפיין style:

const elements = document.getElementsByClassName("someName");
const element = elements[0];
element.style.background = "red";

הקוד שלמעלה יגדיר את צבע הרקע של הרכיב הראשון ששם המחלקה שלו הוא "someName" ל-"red".

הערה: אם elements הוא מערך ריק, התוכנית תיכשל.

challenge icon

אתגר

קל

בקובץ JS:

  1. קבל את הרכיבים של שם המחלקה "cloud"
  2. קבל את הרכיב הראשון ברכיבים (הענן היחיד שלנו) והגדר:
    1. את סגנון top לערך גדול מ־"0px"
    2. את סגנון left לערך גדול מ־"0px"

נסו בעצמכם

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <!-- כתבו כאן קוד HTML -->
        <script src="script.js"></script>
    </body>
</html>

כל השיעורים ביחידה עננים נעים - פרויקט HTML/CSS/JS

תרגלו בעצמכם: Web אונליין