アラフォ〜プログラミング未経験会社員のエンジニアへの道

神奈川県横浜市在住。アラフォーで小学生の息子あり。プログラミング勉強中でHTML/CSS, Ruby, Ruby on Rails, Javascriptなど。 いずれAI関連サービスを開発したい。

[アラフォプログラミング未経験]JavaScriptのライブラリ「jQuery」って何?

Tech::Expertのカリキュラムもいよいよ応用編に突入! 

 

jQuery」というJavaScriptのライブラリに差し掛かりましたが、

 

 

そもそも読み方がわからない・・・

 

 

以前この言葉を見かけたときは、JavaScriptに関連していることすら想像できませんでした。。。

 

そうか、JavaScriptなんだ・・・

 

  目 次

 

 

 

jQuery」って何?

 

JavaScriptRubyに近いので、直感的に理解できた(ような気がした)のですが、

 

jQuery」って何するもんよ?

 

で、引っかかる。。。

 

jQueryとは

JavaScriptは、HTMLとCSSを操作するための言語です。

jQueryJavaScriptのライブラリで、JavaScriptで行えるほぼ全てのことを、

JavaScriptよりも簡単に行うことができます。


「ライブラリ」とは汎用性の高い複数のプログラムを再利用可能な形でひとまとまりにしたもので、

他のプログラムに何らかの機能を提供するコードの集合体です。

つまりjQueryとは「JavaScriptで書かれた様々なお役立ち機能を、

後に再利用しやすい形でまとめあげたパッケージ」だと言えます。

 〜カリキュラムより抜粋〜

 

ほほ〜

 

操作するためのエクセルでいう関数みたいなもんかねぇ

 

特徴は?っと

 

jQueryの特徴

jQueryの特徴は以下の2点です。

①簡単な記述でHTML・CSSを操作できる

少ない記述でHTML・CSSを操作できます。

JavaScriptだと冗長になってしまうプログラムの記述も、

jQueryを使用すると少ない記述で実現できます。

 

②すべてのブラウザに対応してくれる

jQueryでは一つの書き方でほぼ全てのウェブブラウザに対応することができます。

一方JavaScriptでは、GoogleChromeSafariなど各ウェブブラウザの仕様の違いに対応しきれていないため、

使用するウェブブラウザごとに記述を少しずつ変更する必要がありました。

jQueryでは記述を変更する必要がありません。

 〜カリキュラムより抜粋〜

 

全てのWebブラウザに対応できるのか。

なおさら覚えないと今後また引っかかるよね。。。

 

 

jQuery」で何ができるの?

 

まず準備として、必要なファイルをカリキュラムよりダウンロード。

 

 

おっと、jQueryを使用するには、jQueryのライブラリを読み込むのか

 

 

・・・準備は整ったんで、何ができるか確認してみる

 

 

HTML要素を取得してみる

jQueryでのHTML/CSSの操作は非常にシンプルで、以下の2ステップです。


①HTML要素を取得する

②取得したHTMLを操作する

 〜カリキュラムより抜粋〜 

 

なるほど、シンプルやね

 

じゃあコード書いてみよ。

 


ファイル main.js

puts "hello world"

 

 

これで、Chromeのコンソールに出力されました

 

これはやさしいねぇ

 

 

$(ドルマーク)のあとにセレクタと呼ばれるHTMLの指定方法を記述することで、HTML要素が取得できます。

 〜カリキュラムより抜粋〜 

 

とのことでした

 

次はセレクタ要素について、復習していきます!