Webly

Internet + Humana

Ir para o Conteúdo
Ir para o Menu
Ir para a Busca
Ir para o Login

Assine:

Navegação

[prototype]classe De Utilidades - Continuação 01

Continuação da classe, método setattrib

Escrito por Carutcho em JavaScript e Ajax. Data: 26/08/2008

Ver tópico original no fórum.

Fala aee galera blz ?

Esse é uma continuação da classe de Utilidades que eu postei em outro tópico .

O primeiro método que postei, foi o "newElement" feito para substituir o "createElement" do javascript.

Hj estou postando o método para substituir o "setAttribute", pelo seguinte motivo:
O setAttribute, geralmente setamos um atributo por vez e temos um grande problema quando setamos o atributo style , pq no IE não podemos fazer q nem no firefox onde podemos setar todo o Style de uma vez so apenas separando por ";", para isso acho que o prototype resolve com o setStyle, mas só ele não serve para utilizar o setAttribute de um modo mais usual.

O código abaixo não funciona no IE

CODE

element.setAttribute("style","display:block;boder:1px solid;");

Dica:

Caso não tenha seguido os passos do tópico anterior , siga os exemplos e crie a classe e apenas adicione o método, assim pode concentrar todos esses métodos juntos e semrpe que for criar alguma coisa com javascript pode usar esses métodos como base e por favor não se esqueça de importar o prototype

Sintaxe do método setAttrib();

setAttrib(objeto(elemento),'atributos separados por |');

exemplo

classe.setAttrib($("idDoElemento"),'id=idDiv|name=nome|style=boder:1px solid;');

regras de uso:
A única regra de uso é que separe os atributos com o caracter |, para o método conseguir identificar e inserir no seu elemento criado.

Códigos de exemplo:

CODE

Caso tenha seguido o outro post é apenas necessário adicionar esse método depois do método "newElement" colocando uma "," após a "}" que fecha o método e colar esse código aqui logo abaixo:
Depois é só seguir a sintaxe la em cima.

CODE

    setAttrib: function(obj,prop)
    {
        if ((obj)&&(prop))
        {
            var loop = prop.split('|');
             $A(loop).each( function(e)
             {
                 var newE = e.split('=');
                 if(newE[0]=="style")
                  {
                     var gerStyle = newE[1].split(';');
                      var sStyle = ""
                      $A(gerStyle).each( function(style,indice)
                        {
                            _style = style.split(':');
                            sStyle += _style[0]+":"+_style[1]+";";
                        }
                      );
                    obj.style.cssText = sStyle; //add no ie sux
                    obj.setAttribute('style',sStyle);// add no ff
                 }
                 else
                 {
                     if (newE[0]=="onClick")
                     {
                         obj.onclick = newE[1];
                     }
                     if (newE[0]=="class")
                     {
                         if(document.all) newE[0] = "className";
                     }
                     if ((newE[0]=="href")||(newE[0]=="src"))
                     {
                         newE[1] = e.substring(newE[0].length + 1,e.length);
                     }
                     obj.setAttribute(newE[0],newE[1]);
                 }
             }
            );
        }
        else
        {
            return false;
        }
    }

Mais uma vez digo, não sei se existe algum framework que faça esse tipo de coisa, eu estou meio por fora pq geralmente gosto de desenvolver as aplicações com meus proprios códigos, conheço mt pouco da documentação do prototype.

Espero que gostem e até a proximo post