Start function on a specific tag with pure Javascript (gridalicious)

Asked

Viewed 116 times

1

Guys, I’d like to ask for your help in solving this question that I’m facing.

How would be the equivalent, in pure Javascript, of the following jQuery code

    $(document).function();

More specifically, I’m trying to rewrite this code below.

    $(".grid-a-licious").gridalicious({ //parameters })
javascript

1 answer

1


I have to answer something else first:

When you have $(".grid-a-licious").gridalicious({ //parameters }) You can separate that into two parts:

$(".grid-a-licious") is basically a selector to fetch DOM elements, or it will return an array of jQuery objects with the DOM elements that have the class grid-a-licious.

The $ is a function that jQuery creates and is the basis of the jQuery API.

Then, to these elements, the method will be run .gridalicious(). This implies that you have to have jQuery loaded and also a separate file (plugin) with a certain functionality, in this case the gridalicious. This "plugin" was added to the jQuery prototype which means that all the objects that jQuery returns will have this method. This can be done with:

$.prototype.gridalicious = function(){ };

That is, when questions like writing in pure Javascript. Taking out the jQuery qye is a huge library, only this plugin has 327 lines of code and can’t answer here about how to convert to pure Javascript as you should understand.

What I suggest is that you try to further decrease the functionality you’re looking for, which you’ve already tested and put that into another question. Probably modern CSS already does most of the functionality you need.

  • I get it. But, correct me if I’m wrong: $(".grid-a-licious") Equates to Document.querySelector(".grid-a-licious"); Is this correct? If yes, I could do it this way: Document.querySelector(".grid-a-licious"). gridalicious({}); ?

  • @Marlon’s not that simple. You would have to add that method to the prototype of DOM elements, plus you would have to convert all the code of the plugin...

  • I’m a beginner in Javascript. Look, following what has been mentioned, if $(".grid-a-licious") equals Document.querySelector(".grid-a-licious"), it would not work if I iterated between the elements contained within ". grid-a-licious" and assign to each of them the called function?

  • Marlom no. You have to load jQuery and the plugin is done in jQuery. You have to convert everything.

  • Thanks for the clarification Sergio.

Browser other questions tagged javascript

You are not signed in. Login or sign up in order to post.