Difference between jQuery and JavaScript

Followings are major difference between jQuery and JavaScript

JavaScript is a scripting language where as jQuery is a library written in JavaScript. That means jQuery is nothing without JavaScript
JavaScript is powerful but can be difficult to program where as jQuery is very sort and it is easier to program. That means jQuery is very easy to learn or program.
You may face some problem in JavaScript on different browser where as jQuery is browser independent. That means jQuery is a multi-browser supported.
Animation with JavaScript too hard for web developer where as animation with jQuery is very easy for developer

In below example we want to get selected radio button value. You see I have to write multiple line of code in JavaScript where as One line code in jQuery and it is too easy for me.

jQuery Code

var selectedDay = $('input[name="week"]:checked').val();

JavaScript Code

var selectedDay = '';
var days = document.getElementsByTagName('input');
for (var n = 0; n < days.length; n++) {
if (days[n].type == 'radio' && days[n].name == 'week' && days[n].checked) {
selectedDay = days[n].value;
}
}

CODE

<!DOCTYPE html>
<html>
<head>
  <title>jQuery With Example</title>
  <script src="http://code.jquery.com/jquery-1.9.1.js" type="text/javascript"></script>
  <script type="text/javascript">
    $(function () {
      $('.btnJquery').click(function () {
        var selectedDay = $('input[name="week"]:checked').val();
        alert("By jQuery : " + selectedDay);
      });
    });
  </script>
  <script type="text/javascript">
    function GetSelectedDay() {
      var selectedDay = '';
      var days = document.getElementsByTagName('input');
      for (var n = 0; n < days.length; n++) {
        if (days[n].type == 'radio' && days[n].name == 'week' && days[n].checked) {
          selectedDay = days[n].value;
        }
      }
      alert("By JavaScipt : " + selectedDay);
    };
  </script>
</head>
<body>
  <div class="Container">
    <input type="radio" value="Sunday" name="week" />Sunday<br />
    <input type="radio" value="Monday" name="week" />Monday<br />
    <input type="radio" value="Tuesday" name="week" />Tuesday<br />
    <input type="radio" value="Wednesday" name="week" />Wednesday<br />
    <input type="radio" value="Thursday" name="week" />Thursday<br />
    <input type="radio" value="Friday" name="week" />Friday<br />
    <input type="radio" value="Saturday" name="week" />Saturday<br /><br />
    <button type="button" class="btnJquery">Get By Jquery</button>
    <button type="button" class="btnJavaScipt" onclick="GetSelectedDay()">Get By JavaScript</button>
    <p>Please select a week day after that click on these button.</p>
  </div>
</body>
</html>

Pages

Difference between jQuery and JavaScript

No comments :

Please Give Your Feedback