1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

あなたの学びをシェア!2020年までにUdemyで学んだこと03【PR】UdemyAdvent Calendar 2020

Day 4

Udemy フルスタック・Webエンジニア講座 セクション5.jQuery

Last updated at Posted at 2020-11-24

jQueryとは

jQueryとは、JavaScriptで作成されたライブラリで、JavaScriptの書き方などを簡単にすることが出来る。実際、私がJavascriptを勉強した後にjQueryを学習してみると、Javascriptよりコードを書く量が少なく、簡単に書くことが出来た。

clickの使い方

clickのメソッドは、要素をクリックすることでイベントを呼び出すことが出来る。

test.js
$("#circle").click(function(){
    alert("円がクリックされました!");
});

上のようなコードを書くと、円("#circle")をクリックすることで『円がクリックされました!』というアラート(alert)を呼び出すことが出来る。

test.js
$("#circle").click(function(){
    $("#circle").fadeOut("slow");
});

上のようなコードを書くと、円が徐々に消えていくイベントをつくることが出来る。"slow"の他に"nomal"や"fast"を使うことで文字の消えていく速さを変えることが出来る。

jQuery UI

**jQuery UI**では、ユーザーインターフェイスの相互作用、効果、ウィジェット、およびテーマのセット参考にできる。起こしたいイベントをjQuery UIから探して参考にすれば、効率的にコードを書くことが出来るだろう。 [jQuery UIのページ](https://jqueryui.com/)

他にも、jQuery日本語リファレンスというページもjQueryの構文が書いてあるので参考にしてみよう。
jQuery日本語リファレンスのページ

よく出たエラー

要素の中身を()や{}で囲い忘れてしまい、エラーがよく出た。しかし、前回の反省でインテンドをそろえていたのですぐに修正することが可能であった。やはりコードを書く際は綺麗さを重視することが大事なのだと再認識した。

最後に

プログラミングの勉強をしていく中で、これから自分は将来どうしていくかどうかのキャリアを考えてみた。私は現在大学三年生であり、周りの同年代の友人はインターンシップなどの就職活動を本格的に始めている。とりあえず私は現在のインターン先で提示されている課題を取り組み、プログラミング技術の向上を図りたい。そして、大学四年生でWeb系企業に内定をもらえるよう努力する。そして就職した後、そこの企業で実務を経験し、より自らのスキルを強化する。これを実現。 また、どのプログラミング言語を中心にやっていくかどうかは、まだ、プログラミングを深く学んでいないので、現時点でははっきりとは言えない。なのでこれから勉強を進めていく中で自分がなにがしたいのか決定できるようにしたい。

今回の講座はフルスタック・Webエンジニア講座セクション5.jQueryです。
フルスタック・Webエンジニア講座
jQueryを使うことでJavascriptをそのまま使うより簡単にコードを書けるようになりました。

最後に
現在ここでインターンしています。
まだまだ駆け出しですが頑張ります!やる気は人一倍です!
https://senren.work/

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?