Menu
Coddy logo textTech

雲を挿入する

Coddyの「流れる雲 - HTML/CSS/JSプロジェクト」コースのレッスン 16/18。

JavaScriptにおいて、repeat()メソッドは、指定した回数だけ文字列を繰り返して連結した、新しい文字列を構築して返します。

例えば:

const newString = 'test'.repeat(5)
console.log(newString) // testtesttesttesttest
challenge icon

チャレンジ

簡単

前回のレッスンでは、JSを使用してランダムな要素を注入しました。

今回は、その代わりに雲(HTMLコードは既に用意されています)を注入し、少なくとも5回繰り返してください。

心配しないでください。動いている雲は1つだけで、残りは左上に固定されているはずです。次のレッスンですべての雲をアニメーション化します。

Cloud animation example

雲を何度も繰り返しすぎるとメモリの問題が発生する可能性があるため、注意して使用してください!

自分で試してみよう

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <!-- Write HTML code here -->
        <script src="script.js"></script>
    </body>
</html>

流れる雲 - HTML/CSS/JSプロジェクトのすべてのレッスン