Caminhando pelo DOM - Parte III

Vimos que para criar um atriburo bastava declará-lo

Código:

<script language="javascript">

    var meuNo = document.getElementById("email"); //pega a referência ao nó

    meuNo.value = "DIGITE UM EMAIL";

</script>

ou então, para obter o valor de um atributo, bastava

Código:

<script language="javascript">

    var meuNo = document.getElementById("email"); //pega a referência ao nó

    alert(meuNo.value);

</script>

e, por fim para excluí-lo

Código:

<script language="javascript">

    var meuNo = document.getElementById("email"); //pega a referência ao nó

    meuNo.value = "";

</script>

Mas a W3C especifica que para realizar operações com atributos de elementos DOM, nós devemos utilizar alguns métodos do tipo get e set:

-- hasAttribute("atributo") -> verfica se o elemento possui o atributo
-- setAttribute("atributo","valor") -> atribui um valor ao atributo, caso o lemento não o possua, então o atributo será criado
-- getAttribute("atributo") -> obtém o valor do atributo
-- removeAttribute("atributo") -> remove o atributo

então vamos a prática:

Código:

<script language="javascript">

    var meuNo = document.getElementById("email"); //pega a referência ao nó

    meuNo.setAttribute("value","Digite um e-mail"); //atribuímos um valor a atributo;

</script>

para obter seu valor,

Código:

<script language="javascript">

    var meuNo = document.getElementById("email"); //pega a referência ao nó

    alert(meuNo.getAttribute("value")); //obtemos o valor do atributo;

</script>

e por fim,

Código:

<script language="javascript">

    var meuNo = document.getElementById("email"); //pega a referência ao nó

    meuNo.removeAttribute("value"); //removemos o valor do atributo;

</script>

lembrando que, para você seber se o elemento possui um atributo basta

Código:

<script language="javascript">

    var meuNo = document.getElementById("email"); //pega a referência ao nó

    var possui = meuNo.hasAttribute("value"); // retorna true ou false;

   

    if(possui)

        alert("O elemento possui o atributo");

    else

        alert("O elemento não possui o atributo");

</script>

Fonte: Oficina da Net