danik.js,
можно даже так, чтоб лишние имена в глобале не плодить:
<html>
<head>
<style>
.foo{background: red}
</style>
</head>
<body>
<div>foo</div>
<div>bar</div>
<div>baz</div>
<script>
$=function(sel){
var o = document.querySelectorAll(sel)
o.__proto__=$
return o
}
$.addClass = function(className){
for (var i = 0; i < this.length; i++){
this[i].setAttribute("class", className)
}
return this;
}
$("div").addClass("foo")
</script>
</body>
</html>
|
спасибо, вариант krutoy - наиболее удачный
|
Цитата:
Цитата:
|
OlegALL,
Прошу прощения, чуть поспешил. В ФФ не работает, может еще где. Вот этот код протестировал в ФФ Хроме и старой опере. В IE не тестил.
<html>
<head>
<style>
.foo{background: red}
</style>
</head>
<body>
<div>foo</div>
<div>bar</div>
<div>baz</div>
<script>
$=function(sel){
var extend=function(src, trg){
for(var i in src) if(!isNaN(i)) trg[i]=src[i]
}
var o = Object.create($)
extend(document.querySelectorAll(sel), o)
console.log(o)
return o
}
$.addClass = function(className){
for(var i in this){
if(this[i].setAttribute) this[i].setAttribute("class", className)
}
return this;
}
$("div").addClass("foo")
</script>
</body>
</html>
Но гарантировать нгичего не могу, сам экспериментирую:) Это все из-за идиотского поведения нативного API, этих гребаных коллекций, которые и объекты, сука, и не объекты. |
Цитата:
Цитата:
Интересно было бы на твою версию взглянуть. Или опять сольешься? |
Цитата:
Цитата:
Так на ES6:
class $ {
constructor(selector) {
if (!(this instanceof $))
return new $(selector);
Object.assign(this, document.querySelectorAll(selector));
}
addClass(className) {
for (let element of Array.from(this)) {
element.classList.add(className);
}
return this;
}
}
Так на ES5:
function $(selector) {
if (!(this instanceof $))
return new $(selector);
var queryResult = document.querySelectorAll(selector);
for (var i = 0; i < queryResult.length; i++) {
this[i] = queryResult[i];
}
this.length = queryResult.length;
}
$.prototype.addClass = function(className) {
for (var i = 0; i < this.length; i++) {
var element = this[i];
if (~element.className.indexOf(className))
continue;
else
element.className += (" " + className);
}
return this;
}
|
Цитата:
Цитата:
Цитата:
Цитата:
Расскажи, чипушила, чем твоя $ отличается от этой
function $(selector) {
var o=Object.create($.prototype),
queryResult = document.querySelectorAll(selector);
for (var i = 0; i < queryResult.length; i++) {
o[i] = queryResult[i];
}
o.length = queryResult.length; return o
}
посмеши пацанов. Ты делаешь финты ушами только для того чтобы создать объект? Lol. |
Цитата:
Цитата:
|
Erolast, на конец предыдущей строки посмотри.
|
Сейчас другой вопрос.
<body> <div class="class0"> <a href="">link</a> </div> <div class="class0"></div> <div class="class0"></div> </body>
proto={};
$ = function(selector){
var tags = document.querySelectorAll(selector);
tags.__proto__ = proto;
return tags;
}
proto.addClass = function(className){
for (var i = 0; i < this.length; i++){
this[i].classList.add(className);
}
return this;
}
proto.html = function(){
return this[0].innerHTML;
}
console.log( $('div').addClass('class1').html() ); так работает console.log( $('div').addClass('class1').html().addClass('class 2').html() ); а так нет. html() с одной стороны должен возвращать this[0].innerHTML, а с другой this. Как это объединить не знаю. На несовершенство кода пока обращать внимания не надо. как-то надо использовать toString() / valueOf() |
| Часовой пояс GMT +3, время: 12:50. |