function $(selector) { var prefix = selector[0]; selector = selector.substring(1); switch(prefix){ case '#': return document.getElementById(selector); case '.': return document.getElementsByClassName(selector); default: return document.getElementsByTagName(prefix + selector); } } $('.wrapper').onclick = function() { alert('Hello world!'); }
- @lampa, please, tell me more please, how to select several selectors at a time, as implemented in jQuery, for example $ ('. wrap, #reg')? I would be very grateful to you. - Astor
- @ alex83 you will need to break the word into several parts. And each part separately processed. - lampa
- @lampa, but it is possible in more detail, something I did not quite understand ... More precisely, I did not understand at all. - Astor
- one> var selectors = selector.split (','); Further an array you sort. You took up the task, but for some reason you absolutely do not want to search the search. Do not properly approach the problem. - lampa
- @lampa, thanks. Take note of all the above. - Astor
3 answers
Call function wrapped in dom ready
? Or do you have the code after the content?
What does the debugger say?
See what the matter is! The getElementById(selector)
method returns a reference to an object node when getElementsByClassName(selector)
and getElementsByTagName(prefix + selector)
return not an object, but an array of objects. Even if on the page only one element.
You will understand further? I believe in you with all my soul!
- oh yeah how could i miss that Updated post. - lampa
- @lampa, As far as I understand, if an array of objects is returned, in this case js does not select anything. But then how to specify that you need to select the element to which the event was addressed. In jQuery, in such situations this is applied, and how to implement it on pure JS ??? I have the right train of thought, or ...? - Astor
- @ Alex83 well, you understand that on the page of objects with the class
.wrapper
can be arbitrarily! In this case, you just need to go through the array and set all the objects in the array to the desired event. - lampa - @lampa, here is jsfiddle.net/Alex83/kzWQE - Astor
- one@ alex83 you in jsfiddle 2 times the function window.onload is called, so it does not work. jsfiddle.net/kzWQE/1 - lampa
document.getElementsByClassName
returns an array of elements, and you set an onclick
event for this array. Notice the array, not the elements. Therefore it is necessary to go through the elements and each set an onclick
event. A function is desirable to give a name and bind by name, so as not to produce a bunch of unnecessary functions.
- I already understood that, but I don’t know how to fasten a cycle to this, so that it goes through all the elements ... - Astor
- @ Alex83 show me how you tried to loop through the array. - lampa
- @lampa, please see ... var x = $ ('. wrapper'); for (i = 0; i <x.length; i ++) {x [i] .onclick = function () {alert ('Hello world!'); }} - Astor
- @ Alex83 well, that's all right. Does it work? - lampa
- 2@ alex83 so where is your function? - lampa
If I were you, I would replace your construction with this
$$ = function(selector, context) { context = context || document; if (!selector.indexOf("#")) return context.querySelector(selector); else return context.querySelectorAll(selector); }
- And what is your option better? @lampa, what do you say? - Astor
- Well, at least that you can select the context of the search object. And even shorter. - ReklatsMasters
- @ReklatsMasters, but you can use a specific example ... - Astor
- var input = $$ ('# ololo-trigger'); input.checked =! input.checked; switch checkbox - ReklatsMasters
- Well, the id is clear, but what about the class? Add else if ()? - Astor