Перечисление всего js-dom - много кода. Пока в раздумьях.
Разбил на три группы - события, стили и методы. С первыми двумя проблем нет, с третим (mtd) пока разбираю варианты. Примерно так - onmouseover=function() {}; innerHTML='text'; эти похожи, их в первую группу. style.background='red'; у этого добавился style, его во вторую группу. С третей группой неопределённость. setAttribute(); getAttribute(); width+10px; В этой группе значения как считываются, так и присваиваются. В итоге для этой группы код получается вроде такого -
z('.be').mtd(offsetWidth+'px');
Основной код -
z=function(x) {
if (!x) return;
var a = [];
var r;
a.chd = function(x) {for (var i = 0; i < this.length; i++) {return z(x, this[i]);}}
a.stl = function(x) {for (var i = 0; i < this.length; i++) {for (var j in x) this[i].style[j] = x[j];}}
a.evt = function(x) {for (var i = 0; i < this.length; i++) {for (var j in x) this[i][j] = x[j];}}
a.mtd = function(x) {for (var i = 0; i < this.length; i++) {return this[i].x;}}
a.opc = function(b,f,sp) {
for (var i = 0; i < this.length; i++) {
var t=this[i];
if (ie) t.style.filter='alpha(opacity='+(b*100)+')';
else t.style.opacity=b;
if ((b==0) && (f>0)) t.style.display='block';
if ((b==0) && (f==0)) {
if (t.className=='bu') t.style.top='-1000px';
else t.style.display='none';
}
if (b!=f) {
if (b>f) { b=(b*10-1)/10; setTimeout(function() { z(t).opc(b,f,sp); },sp); }
else { b=(b*10+1)/10; setTimeout(function() { z(t).opc(b,f,sp); },sp); }
}
}
}
var e=z.arguments[1];
if (typeof(x) == 'string') {
x=x.toLowerCase();
if (x.substr(0,1)=='#') {
var d=document.getElementById(x.slice(1));
if (d) a.push(d);
return a;
}
if (x.substr(0,1)=='.') r = new RegExp('\\b' + x.slice(1) + '\\b');
}
else {
a.push(x)
return a;
}
e = (e ? e : document).getElementsByTagName("*");
for (var i = 0; i < e.length; i++) {
if (r) {if (r.test(e[i].className.toLowerCase())) a.push(e[i]);}
else {if (e[i].tagName.toLowerCase()==x) a.push(e[i]);}
}
return a;
}
chd - дочерние элементы, stl - стили, evt - события и всё что подходит по синтаксису, mtd - всё остальное, opc - одна из моих функций. # - id, .-класс, пустота - сам тег. Вызов выгдядит так -
z('.t').chd('.bk').stl({background:'url('+btn[l]+') no-repeat'});
// дочерним элементам с классом bk элемента с классом t назначаем фон.
z('.t').chd('.bk').evt({
onmouseover:function {
alert('over');
},
onmouseout=function() {alert('out')}
});
//тоже самое, только обработчики событий.
Если третий mtd удастся пристроить, тогда всё ок. |
Короче с методом (mtd) фигня получается.
z('.t').mtd('setAttribute("class","v")'); элементам ".t" назначить класс "v" ещё как-то вписывается, а вот простая и понятная запись -
function $(x) {return document.getElementById(x);}
$('x').removeChild($('y'));
превращается в
z('#x').mtd(removeChild(z('#y')[0]));
Появился [0], без него я не верну один элемент. Вернулся снова туда с чего начал, либо маркер, либо [0]. Решил оставить [0], пускай с ним будет. В jquery $() тоже возвращает массив, а не сам элемент, но там переписан весь стандартный js, взаимодействующий с DOM, мне же этого не требуется. p.s.
z('.b9').chd('span')[0].onclick=function(){daut();}
z('.b9').chd('span').evt({onclick:function(){daut();}});
Внутри ".b9" у меня только один span, поэтому результат обоих функций идентичен. Тоже самое и тут -
z('#a')[0].innerHTML='Добро пожаловать,';
z('#a').evt({innerHTML:'Добро пожаловать,'});
есть выбор, как с [0], так и без него. А куда этот прицепить - z('x').removeChild(z('y')); и ему подобные. В любом случае без [0], z('y') мне вернёт массив и removeChild выдаст ошибку. Может строгое разбиение, групповые операции - отдельно, единичные - отдельно и создать две разные функции, z() и $(). |
| Часовой пояс GMT +3, время: 21:40. |