LoginSignup
19
14

More than 5 years have passed since last update.

【初心者向け】JavaScriptとjQuery【違いは?】

Posted at

javaScriptとは

ブラウザで実行されるクライアントプログラムだよ。
ブラウザは、ウェブページを画面上に写すソフトだよ(ChromeとかFirefoxとかね!)。
HTMLの操作がおもな役割だよ。
芦田愛菜だよ。

javaScriptの機能

  • HTML要素の操作
    HTMLをいろいろいじれる。例えば、HTMLの要素の属性値やCSSプロパティを変更したり、HTML要素自体を動的に作り出したりできる。
  • 実行条件の指定
    条件に合わせて処理を行なったり、行なわなかったり決めれて、複雑な動きや機能をつけられる。
  • webサーバとの通信
    Ajaxを使って、ページ遷移せずにwebサーバーと通信をすることができる(例:GoogleMapがぬるぬる動くのはこれのおかげですよ)。

jQueryとは

jQueryはjavascriptのフレームワーク
フレームワーク…元になる機能を隠して、ユーザーにより使いやすいようにしてくれるもののこと。
jQueryの各機能はjsの一つ以上の機能をまとめたもので、jsを書くよりも簡単に短くプログラミングができてとっても便利。
ちなみにプラグインを追加することで、jQueryに新しい機能を追加することもできる。

jQueryの人気のある理由

  • プログラムの知識がない人でも比較的簡単に使える
  • jsだと何行もするプログラムをたった数行で実行できる
  • jsにはある『ブラウザによる違い』を無くしてくれる(クロスブラウザ対策)
  • 手軽に使えるプラグインがたくさんあり、新しい機能を追加できる

jQueryを使うには

以下のサンプルのようにHTMLファイルのscriptタグから読んであげます。
このようにjQueryファイルを読み込むことで、同じくHTMLから読み込んでいるjsファイル内でjQueryが使えるようになります。
ダウンロードする場合

<html>
<head>
    <script type="text/javascript" src="js/jquery-3.1.0.min.js"></script>
</head>
<body>
    <script type="text/javascript" src="js/main.js"></script>
</body>
</html>

ダウンロードしない場合

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
</head>
<body>
    <script type="text/javascript" src="js/main.js"></script>
</body>
</html>
19
14
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
19
14