Using jquery in third party js code

First of a开发者_运维百科ll I am new to javascript so this question might be stupid. I have a requirement where i would provide a js script to other websites to include in their webpages.

Now my question is should I use jquery or plain javascript.Will/Can jquery effect the rest of the functionality of the site. Plus what is the benefit I will get using jquery over plain javascript.

My requirement is to get all images of the website and do some processing on the images on these websites.

Thanks in Advance.

I would say, if the processing does not involve jQuery then do not use it.

You need to deal with the following issues if you include it

• failure to load (for network reasons)
• conflict with other versions locally loaded
• conflict with other libraries locally loaded

All issues have workarounds/solutions but you have to implement each an everyone of those.

If you just need to find all images in page, then you can use the .getElementsByTagName() method

var imagelist = document.getElementsByTagName('img');

and just do the processing on that..

You might need of-course to attach your code at the load event to be sure that whatever your code does, the DOM is ready to accept it..

for modern browsers that would be .addEventListener(), while for IE it would be .attchEvent()

your script could be something like this

(function(){ // wrap in a self-invoking function to avoid global name-space pollution

  // attach to the load event so out code runs once the page has loaded
  if (window.addEventListener) { // modern
    window.addEventListener('load', imageProcessor, false);
  }
  else if (window.attachEvent) { // IE
    window.attachEvent('onload', imageProcessor );
  }

  function imageProcessor(){
    // get all images
    var imagelist = document.getElementsByTagName('img');

    // loop the list of images to do something with each image
    for (var img = 0; img < imagelist.length; img++)
     {
       var currentImage = imagelist[img];
       // do processing on the currentImage which hold a reference to the image
     }
  }

})(); // do the self-invoking

demo: http://jsfiddle.net/gaby/nXPzk/

this would be much more easier to achieve with jQuery, mostly because you want to be able to distribute your script to any browser(and jQuery is a cross-browser library), but it does have it's downsides.
If it's your own project, your own page, you know exactly what and when to load/execute, but if you're giving your script to other folks, you have to think of 3 problems at least:

1. different libraries conflicts
   This can be resolved using jquery's noConflict method, but I've seen it fail in some circumstances
2. same library conflicts
   Say that the user already has loaded version X of jQuery. You oblige him to load version Y too, and besides the fact that this would be very inefficient, it may cause conflicts between different jQuery versions.
   There are workarounds for this( to check if jQuery exists and load it asynchroniously if it doesn't) but the code gets a bit more complicated.
3. code size
   When i think of a third party piece of code, I'm thinking...hmm a few kb to load to be able to run a function, but if you want to use jQuery, you may be forcing the one who uses your script to load a whole library just for your one functionality instead of a 1-2 kb (needles to say what the implications are if the user has a slow connection)

Having both the ups and downs in mind, it really depends on what are you doing, so, as Gaby aka G. Petrioli said, " if the processing does not involve jQuery then do not use it".

JQuery is much more convenient than plain javascript. You don't have to worry about cross-browser compatibility (e.g. IE vs. Firefox vs. Chrome). I would recommend this over javascript unless you are want to handle that yourself :)

You can load in the Jquery library, but that might be a little heavy than what you're looking for. Also, you will need to fetch the library from a server, which adds another point of failure (however, if you host this on your own server, then you will have more control).

TLDR: JQuery is convenient. If you have access to it, then you should use it.