王初宝のホームページの開発クラスの第2週の宿題の開発の日誌

先生の頭の中には何もありません.あなたがこのように宿題をすると、受動的な大人は涙を流すだけです.
どこへ行こうか先生.
今回の作業の目標:ajaxとjQuery?「作成」を使用して、ロードするとドルの為替レートが表示されます.

あの赤い箱のように...私の最初の週のホームページを利用して・・・
雪を拭いてからやるべきことをすることにした.泣いているのか.じゃ、やるべきことをしましょう.

確認してから行きましょう。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

ajaxを適用する前に、上のjクエリースクリプトが適用されているかどうかを確認する必要があります.
そうでなければajaxは適用されません...

 <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>

適用のみの場合、Ajaxが適用されない場合もあります.今日のスケジューラは、Slimは容量を最小限に抑えるためにAjaxに適用されないスクリプトだと教えてくれました.奥深いコードの世界...
いずれにしても、スクリプトがうまく応用されていて、本当に宿題が始まりました.

ジョブの開始

1.

まずドル-ウォンの為替レートが入る位置があるのでhtmlを入力しました.

<p class="rate" style="color:red;">달러 원환율 : <span id="now_rate"></span></p>

2.

今、スクリプトに触れます・・・
そして本当に知らなかった...パンツの宿題の質問者のコードと指導者の回答を参考に、虫のコードを触ってみました.

    <script>
        $(document).ready(function () {
             exchage();
        });

        function exchage() {
            $.ajax({
                type: "GET",
                url: "http://spartacodingclub.shop/sparta_api/rate",
                data: {},
                success: function (response) {
                    let exchangeRate = response['rate'];
                    $('#now_rate').append(exchangeRate);
                }
            })
        }
    </script>

わあ!完了!

$(document).ready(function () { exchage(); });

コード「ロード後に呼び出す」

function exchage() {
            $.ajax({
                type: "GET",
                url: "http://spartacodingclub.shop/sparta_api/rate",
                data: {},
                success: function (response) {
                    let exchangeRate = response['rate'];
                    $('#now_rate').append(exchangeRate);
                }

apiですか?インポートした関数のようです...今日も感性がわかる
ここでexchangeとexchgeRateは私が任意に設定した変数名です...
事実上.redyコードを書く前に、このコンソールをどのように命令すればいいか、それとも働かないか分かりません.レディーを書く前にどうしてだめなの?どうしてだめなの?泣いているだけで分からない.书き终わったら闻いて和弦を书きました.とにかく...
-さらに理解する必要があります:console.log()に親しむ
-了解:
このようなapiでは、[rate]に応答して対応する値をロードすることができる.

変更点

そして、前回の作業で抜けたボタンを押した時に、慌ててオーダー完了alertスクリプトを追加…
次はスクリプトです

<script>
function order() {
            alert('주문이 완료되었습니다!');
        }
</script>

次はhtml

<div class="btn" onclick="order()">
	<button class="btn btn-primary" type="submit">주문하기</button>
</div>

今日も虫の宿題に成功しました