Using jQuery statements in plain javascript functions

Question

Is it a good or bad practice to use jQuery statements in plain javascript functions outside of ready? If not what is the correct way?

//** End ready **//

function doSomething() {
    selectedClickBoxIndex = parseInt( jQuery('.' + clickBoxOnClass ).attr('value') );

    // Javascript code  
}

Yes, of course it is. You can use jQuery functions wherever you want and need. — Adriano Repetti
– Adriano Repetti, Commented Apr 23, 2012 at 13:24
as far as i've learnt jQuery is an effective shorthand alternative to javascript to introduce unobtrusive scripting.. so using jQuery in conjuction with javascript is not something i'd recommend as it'd feel like defeating the purpose of jQuery, also the modularity of code and uniformity gets affected when multiple people work mixing js and jQuery making it very hard to look at — optimusprime619
– optimusprime619, Commented Apr 23, 2012 at 13:27
@optimusprime619 jQuery isn't an alternative to JavaScript - it is JavaScript. It is in fact inherently impossible to use jQuery without using JavaScript. — Pointy
– Pointy, Commented Apr 23, 2012 at 13:33
@JamesPoulson note that to get the value of an element you should probably use .val() and not .attr("value") ... — Pointy
– Pointy, Commented Apr 23, 2012 at 13:34
@Pointy i used the world alternative in the context of using "implementation" :) but yes, i understand that it is actually javascript.. — optimusprime619
– optimusprime619, Commented Apr 23, 2012 at 13:55

Rodolfo · Accepted Answer · 2012-04-23 13:24:17Z

5

nothing wrong. When you include the jquery file, you're expanding your functionality, free to use wherever you want

answered Apr 23, 2012 at 13:24

Rodolfo

4,19325 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

user1106925 Over a year ago

jQuery doesn't expand functionality. There's nothing with jQuery that you can't do without it.

Elliot Bonneville Over a year ago

Agreed. It just makes existing functionality (much) easier to implement.

user1106925 Over a year ago

@ElliotBonneville: Sometimes.

Jon Adams · Accepted Answer · 2012-05-04 19:10:43Z

3

There is nothing wrong with that. jQuery is just a Javascript library, there is no strict separation between them.

You might want to use the function val, though:

function doSomething() {
  selectedClickBoxIndex = parseInt( jQuery('.' + clickBoxOnClass ).val() );

  // Javascript code  
}

edited May 4, 2012 at 19:10

Jon Adams

25.3k18 gold badges85 silver badges122 bronze badges

answered Apr 23, 2012 at 13:25

Guffa

703k111 gold badges760 silver badges1k bronze badges

Comments

Elliot Bonneville · Accepted Answer · 2012-04-23 13:24:27Z

2

That's completely acceptable; just make sure you call those functions after the DOM has loaded, either from document ready or some equivalent.

answered Apr 23, 2012 at 13:24

Elliot Bonneville

53.6k23 gold badges101 silver badges125 bronze badges

1 Comment

primavera133 Over a year ago

Actually, you can call it before ready, just make sure it's after the specific elements you want the script to handle has been parsed.

David Hedlund · Accepted Answer · 2012-04-23 13:24:36Z

2

There's nothing wrong with that at all.

What you want to make sure is that no references to DOM nodes are made before DOMReady. This is true regardless of whether you use $('.someClass') or document.getElementsByClassName.

Your function does make such a reference, but this is fine as long as the function itself is not called before DOMReady.

answered Apr 23, 2012 at 13:24

David Hedlund

130k33 gold badges205 silver badges223 bronze badges

Comments

Josh Mein · Accepted Answer · 2012-04-23 13:25:34Z

2

There is no reason not to use it outside of the document.ready. It makes it much easier to traverse and modify the dom.

The ability to grab elements on the page through the many useful jquery selectors is a good enough reason to use it elsewhere.

answered Apr 23, 2012 at 13:25

Josh Mein

28.6k15 gold badges79 silver badges89 bronze badges

Comments

Ivan Marjanovic · Accepted Answer · 2012-04-23 13:28:38Z

2

As long as function doSomething() is triggered after onLoad event it is totally OK to do it that way. $(document).ready is just a way for JS execution to be postponed until page is fully loaded.

answered Apr 23, 2012 at 13:28

Ivan Marjanovic

1,0341 gold badge10 silver badges16 bronze badges

Comments

Muhammad Raheel · Accepted Answer · 2012-04-23 13:24:03Z

1

Why not this will reduce the line of code and also jquery is compatible with all the browsers

answered Apr 23, 2012 at 13:24

Muhammad Raheel

19.9k7 gold badges69 silver badges106 bronze badges

Collectives™ on Stack Overflow

Using jQuery statements in plain javascript functions

7 Answers 7

3 Comments

Comments

1 Comment

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

7 Answers 7

3 Comments

Comments

1 Comment

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related