Javascript

jQueryを使用してアニメーションをグローバルに無効にするには、jQuery.fx.off（）メソッドを使用します。 アニメーションを有効にするには： $("#enable").click(function(){    jQuery.fx.off = false; }); アニメーションを無効にするには、jQuery.fx.off（）をtrueに設定します： $("#disable").click(function(){    jQuery.fx.off = true; }); 次のコードを実行して、jQu

GatsbyJSはReactフレームワークですが、カスタムJavaScriptをGatsbyプロジェクトに追加する方法を知っておくと便利です。おそらく、古いWebサイトをGatsbyに移動したばかりで、今はReactJS構文に変換するのがあまり好きではないカスタムバニラJavaScriptがたくさんあると思います。 幸い、プレーンなJavaScriptをGatsbyに追加することはまったく難しくありません。必要なのは、単純なファイルhtml.jsを公開することだけです。 、これはデフォルトではGatsbyプロジェクトに表示されません。 html.jsを公開（利用可能）するには ファイルを

生のバニラJavaScriptを使用して要素に複数のスタイルを追加すると、少し不格好に感じる可能性があります。プレーンJavaScriptを使用して要素のスタイルを設定するために私が見た最も一般的なアプローチは、ターゲット要素を取得してから、一度に1つのスタイルを追加することです。 // Grab target element (here via its class attribute) const buttonAddToCart = document.querySelector(.button-add-to-cart) // Add style properties, one at a t

3つの異なる方法を使用して、プレーンJavaScriptで配列の最後の要素を取得する方法を学びましょう。まず、アイテムの配列を設定して、作業するものを用意します。この場合、演習のリストを使用します。 エクササイズ配列を作成 const exercises = ['pull-up', 'push-up', 'squat', 'deadlift'] リストの最初のものを取得する場合は、exercises[0]を使用します 、2番目の使用を取得するにはexercises[1] しかし、リストにある運動の総数がわからない場合はどうなりま

JavaScriptを使用して特定の期間が経過した後、関数を呼び出したり実行したりする方法はいくつかあります。 2つのJavaScriptタイムイベントメソッドsetTimeout()を紹介します およびsetInterval() 。 これらのタイムイベントメソッドの違いは次のとおりです。 setTimeout() 指定されたミリ秒数待機した後、関数を1回実行します setInterval() 指定された時間間隔で関数を継続的に実行し続ける それぞれの簡単な例を見てみましょう。 JavaScript setTimeout（）の例 次のコードをコーディングプレイグラウンドのJav

JavaScriptで配列を空にする方法を学びましょう。 JavaScriptで配列を空にすることは、これ以上簡単なことではありません。演習のリストを含む配列があるとします： let exerciseList = [squat, deadlift, push-up, pull-up] console.log(exerciseList)を使用します 演習のリストを印刷して、それが機能することを確認します。 次に、アレイを空にするには、次のコマンドを実行します。 exerciseList.length = ここで、console.log(exerciseList) ここでも、空の配列が取

JavaScriptで昨日の日付を取得するには、次のように、現在の日付を取得してから1日を引くだけです。 const today = new Date() const yesterday = new Date(today) yesterday.setDate(yesterday.getDate() - 1) today.toDateString() yesterday.toDateString() 昨日の日付でコンソールからログアウトしてみてください： console.log(yesterday.toDateString()) 素晴らしくシンプルです！

入力フィールドが空かどうかに基づいてボタンを無効または有効にする方法を学びます。 Webでフォームに入力すると、すべてまたは一部のテキストフィールド（必須フィールド）に入力するまでフォームを送信できないことがよくあります。同じ原則がチェックボックスとラジオボタンにも当てはまります。 入力フィールドが空かどうかに基づいて、ボタンの状態（有効か無効か）を制御する方法は次のとおりです。 HTML 次のHTMLをエディタに追加します： JavaScript 次のJavaScriptを追加します let input = document.querySelector(.input) le

三項演算子はJavaScript演算子であり、if/elseステートメントで入力する多くのコードを節約できます。

HTMLフォームのページ読み込みで最初の入力フィールドにオートフォーカスする方法を学ぶ 優れたUXデザインの基本的な前提の1つは、ユーザーが必要なものをすばやく取得できるように、aからbに到達するためのステップをできるだけ多く節約することです。 フォーム、特に長いフォームへの入力を楽しむ人は誰もいないので、ページの読み込み時にHTMLフォームの最初の入力フィールドにオートフォーカスを設定して、ユーザーの時間を少し節約しましょう。 HTMLフォーム このフォームコードをHTMLドキュメントに追加します： JavaScript このJavaScriptonload関数を.jsフ

GatsbyjsとNext.jsは、現在Web開発で最も注目されているトピックの2つです。 YouTubeの掲示板やコメントのセクションで、なぜどちらを選ぶのかと尋ねる人がたくさんいます。私は過去12か月間、Next.jsとGatsbyjsの世界に頭を抱えていました。そのため、このディスカッションに参加する資格があると思います。 プロジェクトにNext.jsまたはGatsbyを使用する場合、「適切なジョブ表現のための適切なツール」が思い浮かびます。しかし、私があなたをそのような漠然とした答えでぶら下げたままにするつもりはないので心配しないでください。 TLDR： GatsbyとN

JavaScriptオブジェクトリテラルとは何かについて学びます。 プログラミングには、実際よりも複雑だと思わせるような名前が付けられた概念がいくつかあります。オブジェクトリテラルは、食料品のリストほど複雑ではありません。 オブジェクトリテラルとは何ですか？ オブジェクト はJavaScriptの特殊なタイプの値であり、他の値と接続できます。 オブジェクトリテラル 文字通りのオブジェクト値です プログラム/アプリに書き込みます。 オブジェクトリテラルは通常、コンマで区切られた名前と値のペアのリストで構成されます（ property：value ）、中括弧で囲まれています {} 。

JavaScriptドット表記とは何かについて学びます。 ドット表記の「表記」部分にはあまり注意を払わないでください。実際よりも複雑に聞こえる可能性があります。ドット表記は、ドット（.を使用してオブジェクトに値を読み取ったり割り当てたりする行為です。 ）。 犬というオブジェクトがあるとします： const dog = { name: Naya, age: 2 } 次に、その値の1つを読み取ります。犬の年齢： console.log(dog.age) // Result: 2 それは読書です ドット表記のオブジェクトからの値。 それでは、犬に新しい価値を与えましょう

JavaScriptでの引数とパラメーターの違い、および使用する用語が重要かどうかについて学びます。 JavaScriptの引数/パラメーターとは何ですか？ JavaScriptで関数を実行する場合、関数を呼び出すときに関数に情報を渡すオプションがあります。 渡す情報は引数またはパラメーターと呼ばれ、ほとんどの開発者は概して2つの用語を同じ意味で使用します。 例： function greetings(name) { console.log(name) } greetings(Anna) Anna 一部はgreetings（）のときに渡されるものです 関数が呼び出されます。

JavaScriptでの関数宣言と関数式の違いについて学びます。 これは関数式です： // Function expression let excuteMe = function () { console.log(Function Expression) } これは関数宣言です： // Function declaration function excuteMe() { console.log(Function Declaration) } 関数の式と宣言はほとんど同じことをします。上記の両方の例では、次のように呼び出しますexecuteMe() 次に、コードブロック{.

JavaScriptでは、リテラルとは、値を文字通り参照する場合です。 スクリプトファイルに書き込みます。 リテラルにはさまざまな種類があります： 4 数値リテラルです "Icecream" 文字列リテラルです {color: "red"} オブジェクトリテラルです オブジェクトリテラルの詳細については、こちらをご覧ください。

JavaScriptの変数とは何ですか、そしてそれは何をしますか？ JavaScript、および一般的なプログラミング言語では、変数は値への参照を格納するために使用するコンテナーであり、必要なときにそれらを使用して処理を実行できます。これらの値は、文字列（テキスト）から数値、関数、さらには他の変数まで、ほとんど何でもかまいません。 いくつかの例： 文字列値：let name = 'James' 数値：let amount = 100 関数値：let myFunction = function() {} 変数値：let fullName = firstName + l

JavaScriptで値と見なされるものを学びます。 JavaScriptでは、 valueという用語 多くのものが値と見なされ、多くのタイプがあるため、は抽象的な（広い）概念です。 値の。例： 数字 文字列 機能 オブジェクト ブール値 null 未定義 JavaScriptの値のタイプについて疑問がある場合は、typeofを入力してください 値の前に。以下の例をコンソールで試してください： console.log(typeof Hi there!) // output: string console.log(typeof 7) // output: number conso

JavaScriptの厳密な等式演算子と緩い等式演算子の違いと、それが重要である理由について説明します。 JavaScriptでは、2つの等式演算子を使用して値を比較できます。緩い等式演算子== （double equals）および厳密な等号演算子=== （トリプルは等しい）。表面上は同じように見えますが、そうではありません。違いを理解することが重要です。そうしないと、バグに遭遇する可能性があるからです。 コンソールで次のコードを実行してみてください： let a = 4 // number let b = 4 // string console.log(a == b) // outpu

JavaScriptでの表現とは何か、そしていくつかの単語が物事を実際よりも複雑に聞こえさせる方法を学びましょう。 JavaScriptでは、式は、値で回答される質問をするための単なる方法であり、常に単一の値 。 これは表現です： console.log(5 + 5) // result: 10 上記で起こっていることは次のとおりです。 あなたは尋ねます：「JavaScript、5 + 5とは何ですか？」 JavaScript：「5+5は10に評価されます。 式は、結果を取得する方法です。 またはの評価 （同じこと、別の単語）入力の—この場合、5+5。 JavaScri