How many lines of code will be saved using jQuery instead of direct javascript?

Question

Perhaps someone more familiar with the topic can help me simplify or write the question correctly. We are looking for metrics in jQuery or even other JS frameworks compared to using direct javascript. I don’t believe in lines of code metrics, I never have, but I can’t think of anything else to measure it.

Function Points (jquery) = Jquery-LOC
Function Points (JS) = JS-LOC

Answer 1

To attach a click handler using standard javascript, you can try something like this:

var myelement = document.getElementById("clickme");
function myClickHandler (evt) {
  var evt = evt || event; // ie uses a global instead of
                          // passing an object as a param
  (evt.target || evt.srcElement).style.width="110px";

}
if (myelement.addEventListener) {
   myelement.addEventListener("click", myClickHandler, false);
} else if(myelement.attachEvent) {
   myelement.attachEvent("onclick", myClickHandler);
} else if(typeof myelement.onclick === "function") {
    (function () {
      var oldfunc = myelement.onclick; 
      myelement.onclick = function (evt) {
          var evt = evt || event;
          oldfunc(evt);
          myClickHandler(evt);
      }
    })()
} else {
   myelement.onclick = myClickHandler;
}

or try to do something similar using jquery

jQuery("#clickme").click(function(evt){ jQuery(evt.target).css("width",110); });

, - , , . ? , , , - .

, , jquery. , , , , . , . , , jquery . - , , , , . - , addEventListener , , JQuery "" . , .

jQuery , , , " ". , dom APIS, , , .

( jquery), .

, ? ? . ? - , jQuery ? .

- , . , . , , , .

Answer 2

, , , , jquery, .

, DOM-, 5 . .

Answer 3

, . ? 12 .

Answer 4

" " .

jQuery, ( jQuery !), LOC - .

jQuery . , , , .

Answer 5

, ? -, .

Answer 6

JQuery JavaScript, . ? - , , . , , .

.

Answer 7

.

Answer 8

, LOC , , $('#my_id') vs document.getElementById('my_id'), - , .

Answer 9

.

jQuery - , 20 , ( 1.3.2) 4376 jQuery, 16 .

, 9000 jQuery, .

, 4376 , 16 , , , , , 16 . , , , , 9000 , 20.

, .

Answer 10

, , , OP. :

jQuery("#clickme").click(function(evt){ jQuery(evt.target).css("width",110); });

IE8 , , , :

document.getElementById('clickme').addEventListener('click', function(e){e.target.style.width = '110px';}, false);

LOC JavaScript, jQuery, lib .

: App-A, jQuery + libs VS App-B, JS + libs. App-B libs, App-A, lib, Js, .

, - lib, , 0.? 4kB, , , lib, -B:

getEl('clickme').ev('click',{ width: 110 });

jQuery, , JS, .