atributo

[Biel. 9]

Olá pessoal. Direto ao ponto. Pessoal quero colocar os atributos html na mesma linha document, sem repetir var aluno e que funcione, como faço? Obrigado! 

style.display="none" 
disabled=true;
value="aprendiz"
name="joao"

...

Ex1
 <script>
   var aluno = document.getElementById("id_1").style.display="none" ; 
 </script>   
   
<hr />  
 
  Ex2
 <script>
   var tete = document.getElementById("id_1").style.display="none" ; 
   var tete = document.getElementById("id_1").disabled=true;
 </script>

 

[wanderval 19]

Isso que você quer tem um preço, não tem como você colocar em uma única linha sem haver uma lógica de manipulação, o motivo é muito simples, os métodos e propriedades pertencem a uma hierarquia, então tendo diferentes níveis isso se torna impossível, nesse exemplo abaixo você tem esse comportamento mas a manipulação continua sendo feita internamente dentro do objeto AttributeBuilder

 

 

const attribute = AttributeBuilder()
  .setElement('id_1')
  .setDisplay('block')
  .setDisabled(false)
  .setValue('aprendiz')
  .setName('joao')
  .build();

const attribute2 = AttributeBuilder()
  .setElement('id_2')
  .setValue('other field')
  .setName('Euclides')
  .build();


function AttributeBuilder() {
  return {
    setElement: function(elementId){
      this.element = document.getElementById(elementId);
      return this;
    },
    setDisplay: function(style) {
      this.element.style.display = style;
      return this;
    },
    
    setDisabled: function(status) {
      this.element.disabled = status;
      return this;
    },
    
    setValue: function(value) {
      this.element.value = value;
      return this;
    },
    
    setName: function(name) {
      this.element.name = name;
      return this;
    },
    
    build: function() {
      console.log("Building object...");
      return this.element;   
    }
  }
}

Link Jsbin: https://jsbin.com/vokoyinico/edit?html,js,output

[Omar~ 87]

Mas @wanderval ele pode usar o atributo "data" e obter quantos dados quiser....

Só que como você mesmo diz (é mais lento para processar):

4 horas atrás, wanderval disse:

Isso que você quer tem um preço

 

<div
    id="algum"
    data-a="alguma_coisa_1"
    data-b="alguma_coisa_2"
    data-c="alguma_coisa_3"
    data-d="alguma_coisa_4">
  ... e por aí vai...
</div>
<script>
    console.log(document.getElementById('algum').dataset);
</script>

 

[wanderval 19]

Sim @Omar~ no caso da leitura essa seria uma ótima solução, quando fiz a solução confesso que fiquei um pouco confuso com a descrição mas entendi que ele queria fazer uma chain pra setar valores usando uma única referência de html. No caso o Ex1 seria o que ele deseja o Ex2 o que ele queria evitar, mas confesso que um builder nessa situação é um exagero rs.

 

Obs: e percebo que o @Biel. está cometendo um equivoco porque está declarando a mesma variável 2 vezes no Ex2 sem reutilizar a referência. talvez sejá esse um dos pontos que gerou a dúvida dele.

// Erro declarar a mesma variavel 2 vezes
var tete = document.getElementById("id_1").style.display="none" ; 
var tete = document.getElementById("id_1").disabled=true;

//Solução
var tete = document.getElementById("id_1");
tete.style.display="none";
tete.disabled=true;