Цепочка вызовов jQuery
Привет
Задача - сделать так: $('div').addClass('class1').html().addClass('class 2').html(); (без new), не создавая экземпляра класса, оставив при этом прототипное наследование.
function $(selector){
this.tags = document.querySelectorAll(selector);
}
$.prototype.addClass = function(className){
for (var i = 0; i < this.tags.length; i++){
this.tags[i].classList.add(className);
}
return this;
}
$.prototype.html = function(){
this.tags[0].innerHTML;
console.log(this.tags[0].innerHTML);
return this;
}
new $('div').addClass('class1').html().addClass('class2').html();
|
|
Цитата:
OlegALL, ты, что вообще хочешь получить? Присвоить ДИВу два класса и вернуть его ХТМЛ? |
Цитата:
|
Цитата:
var val=$('div').addClass('class1 class2').html();
|
Спасибо Erolast за ссылку. Получилось так:
var $ = function (selector){
this.tags = document.querySelectorAll(selector);
if(this.$) {
return new $(selector);
}
}
$.prototype.addClass = function(className){
for (var i = 0; i < this.tags.length; i++){
this.tags[i].classList.add(className);
}
return this;
}
$.prototype.html = function(){
this.tags[0].innerHTML;
console.log(this.tags[0].innerHTML);
return this;
}
$('div').addClass('class1').html().addClass('class2').html();
Только вопрос: почему зацикливается вызов $, если писать так: return new $(selector); а не так:
if(this.$) {
return new $(selector);
}
|
Цитата:
<html>
<head>
</head>
<body>
<div>foo</div>
<div>bar</div>
<div>baz</div>
<script>
var $ = function (selector){
this.tags = document.querySelectorAll(selector);
if(this.$) {
return new $(selector);
}
}
$("div")
alert(tags)
</script>
</body>
</html>
|
Цитата:
Логика такая: если this - инстанс конструктора $, то все пучком, делаем поиск по селектору. Если же нет - создаем инстанс сами через new и возвращаем результат. Таким образом, когда будешь писать $('div'), то будет два вызова - один как вызов функции, второй - как вызов конструктора (через new, создание инстанса то есть). Оно у тебя и щас так работает, но условие не совсем подходящее. |
Цитата:
|
danik.js,
Слушай, по-моему это чушь какая-то. Какие нах*й инстансы и классы? цель банальна -- вернуть (псевдо) объект, так? Так почему бы не написать тупо
proto={}
$=function(sel){
var o = document.querySelectorAll(sel)
o.__proto__=proto
return o
}
proto.addClass = function(className){
for (var i = 0; i < this.length; i++){
this[i].setAttribute("class", className)
}
return this;
}
и так далее. Зачем этот цирк? |
| Часовой пояс GMT +3, время: 04:26. |