Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

JQuery: what's the non-JQuery equalavent of "$("#myDIV li").eq(1)"?

I'm trying to de-couple my dependence on JQuery, as such - I have the following JQuery:

$("#myDIV li").eq(1).html('...');
$("#myDIV li").eq(2).html('...');
$("#myDIV li").eq(3).html('...');

How do I perform the above code without using JQuery (just plain JavaScript).

like image 453
Teddyk Avatar asked May 11 '10 17:05

Teddyk


People also ask

What is alternative to jQuery?

A progressive JavaScript framework, Vue. js is considered a good alternative to jQuery. It is an open-source, MVVM, front-end JS framework that is considered ideal to create user interfaces and single-page apps. It is also considered good for web interfaces, desktop, and mobile app development.

Which one is equivalent to $( document .ready function?

Answer: Use the DOMContentLoaded Eventready() equivalent without jQuery.

What does $() mean in jQuery?

In jQuery, the $ sign is just an alias to jQuery() , then an alias for a function. This page reports: Basic syntax is: $(selector).action() A dollar sign to define jQuery. A (selector) to "query (or find)" HTML elements.

What is $( this in JavaScript?

$(this) is a jQuery object and this is a pure DOM Element object. See this example: $(".test"). click(function(){ alert($(this). text()); //and alert(this.


2 Answers

var lis = document.getElementById('myIDV').getElementsByTagName('li');
lis[1].innerHTML = '...';
lis[2].innerHTML = '...';
lis[3].innerHTML = '...';

Btw, if you wanna do it with jQuery, save your elements first and work on them, instead of traversing the DOM every time:

var lis = $("#myDIV li");
lis.eq(1).html('...');
lis.eq(2).html('...');
lis.eq(3).html('...');
like image 72
Andreas Grech Avatar answered Oct 05 '22 23:10

Andreas Grech


document.getElementById("myDIV").getElementsByTagName("li")[0].innerHTML = '...';

etc.

However the question remains - why not use jQuery?

Clarification: I'm not trying to suggest that one should ignore how things work. If that's what the OP was going for, then fine. However, I consider jQuery a part of the "standard overhead" for a page nowadays, and don't hesitate to use it even for the tiniest of things, since I'll most likely end up needing more of it later anyways.

like image 36
Matti Virkkunen Avatar answered Oct 06 '22 01:10

Matti Virkkunen