Como começar meu novo script da maneira mais simplificada

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

  • 0

Como começar meu novo script da maneira mais simplificada Empty Como começar meu novo script da maneira mais simplificada

Mensagem por Shek em 06.07.18 1:27

Bem, irei explicar, ou tentar explicar com poucas palavras como aprendi a desenvolver pequenos scripts para fóruns Forumeiros. Apesar de ter pouco conhecimento, quero compartilhar esse conhecimento, e quem sabe mostrar como este processo se tornou fácil para mim.

Primeiro passo

Antes de mais nada, gosto de procurar entender o que desejo fazer. Ou seja, se quero mudar um texto inalterável da forma padrão (que não tenha como fazê-lo pelo painel de controle, por exemplo) ou se quero apenas incluir novos elementos. Para isso, primeiro você precisa criar um foco no que deseja.

Apesar de ter diferenças notórias e explicáveis pelos desenvolvedores de script, para mim, tudo é igual quando se trata do que vou mostrar. Aff

Cifrão ou "jQuery"?

Existe, para mim duas formas diferentes de tratar o script. É usando o "jQuery" ou apenas o cifrão "($)". Apesar de serem diferentes na aparência, na execução é a mesma coisa para mim.
Código:
$("div")
Ou
Código:
jQuery("div")
Para mim, ambos são iguais, mas, na hora de montá-los e aplicar no fórum, ela pode surtir efeitos diferentes.

Se aplicar o jQuery nos widgets ou na mensagem página inicial, por exemplo, o código simplesmente se desfará por causa do SCeditor, então, nestes casos prefiro usar o cifrão mesmo.

Executar

Apesar de ambos os métodos que disse anteriormente serem, pelo menos para mim a mesma coisa, procuro continuar o script executando a função .ready(). Até onde sei, o .ready executa o script quando a página estiver carregada. Isto é, uma forma mais simples de dizer. Há uma explicação mais detalhada na biblioteca do jQuery... Muito feliz

Código:
// COMEÇAR UM SCRIPT
$(document).ready();
Desta forma, eu começo usando o que acredito ser um objeto (document), e depois, a função ready para iniciar o script.
Código:
$(document).ready(function() {
// PROPRIEDADE
});
Dentro do ready() eu defino uma function, que por sua vez pode receber um nome, ou apenas ficar vazia (dentro dos parenteses). As chaves {} permitem que eu possa incluir qualquer propriedade de script que desejo. Então, se quero, por exemplo, remover meu logo do fórum usando script, então, vou usar um seletor, só que desta vez, ao invés de definir o document dentro de parentes de novo, vou indicar o seletor que desejo mudar ou atribuir uma nova função à ele.
Código:
$("div").remove();
Bem, neste caso acima, eu indiquei que meu script remova toda div que exista no fórum. Ou seja, que ele remova qualquer elemento HTML na página que comece assim:
Código:
<div></div>
O código final para testes, ficaria assim:
Código:
$(document).ready(function() {
   $("div").remove();
});

O que é esse ".remove()"?

Na biblioteca do jQuery, o .remove(); indica que queremos remover o que estiver marcado no seletor anterior. Ou seja, vamos remover tudo que existir, quando se tratar de uma <div></div>. Assim como .remove(), existem vários outros que facilitam a nossa vida na hora de executar o código.

Como eu quero remover meu logo, então, eu tenho que definir ao meu script o seletor os caminhos que ele deverá percorrer na página (isso talvez se remeta ao sentido do document) e encontrar o seletor exato a ser removido (.remove()). Muito feliz

Como sei qual é o seletor?

No caso do logo, vamos identificar o logo na versão phpBB3 do fórum pelo seletor #logo. Veja na imagem a seguir:


Então, temos o link do logo do fórum, e dentro deste link temos a tag de imagem <img src>, que por fim é a responsável pela imagem do logo. Neste caso, formaremos o seguinte no script:
Código:
$(document).ready(function() {
   $("a#logo").remove();
});
O seletor com a hashtag (#) determina que o elemento HTML é um ID (<a id="logo">), e quando é uma CLASS, é usado um ponto (<a class="logo">):
Código:
$(document).ready(function() {
   $("a.logo").remove();
});
Por fim, usando script a seguir, vamos remover o logo do fórum:
Código:
$(document).ready(function() {
   $("a#logo").remove();
});
Muito feliz

É claro, existe especificações... Como o real motivo e razões pelo qual usar o cifrão ou o jQuery, ou o nome de cada um, mas, estou ensinando a forma simplificada da coisa, para que mais pessoas possam criar seus scripts mais básicos.

É isso. Mostrando a lingua
Shek

Shek
Admineiro
Admineiro

Masculino
Inscrito dia : 11/04/2009
Mensagens : 18392
Pontos Ativos : 22227

https://shiftactive.blogspot.com https://go.topicit.net/ZosT/61pMt1mPsG https://www.facebook.com/ShiftActif https://twitter.com/ShiftActif

Como começar meu novo script da maneira mais simplificada Empty Re: Como começar meu novo script da maneira mais simplificada

Mensagem por Daemon em 06.07.18 13:02

Excelente Shek, parabéns pela iniciativa! 10/10
Daemon

Daemon
Membro do Fórum

Masculino
Inscrito dia : 02/03/2012
Mensagens : 1127
Pontos Ativos : 1732

http://bestskins.forumeiros.com/

Como começar meu novo script da maneira mais simplificada Empty Re: Como começar meu novo script da maneira mais simplificada

Mensagem por Shek em 07.07.18 6:43

Obrigado Daemon! Muito feliz Espero ser de ótima valia aos usuários.


Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Shek Crowley
Shek

Shek
Admineiro
Admineiro

Masculino
Inscrito dia : 11/04/2009
Mensagens : 18392
Pontos Ativos : 22227

https://shiftactive.blogspot.com https://go.topicit.net/ZosT/61pMt1mPsG https://www.facebook.com/ShiftActif https://twitter.com/ShiftActif

Como começar meu novo script da maneira mais simplificada Empty Re: Como começar meu novo script da maneira mais simplificada

Mensagem por Pedxz em 07.07.18 7:23

Eu como ando a começar a aprender JavaScript, é interessante ver este tutorial. Ajudou demais Muito feliz


Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Pedxz Moderadeiro
Pedxz

Pedxz
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 13/01/2017
Mensagens : 3231
Pontos Ativos : 3883

https://power-pixel.net

Como começar meu novo script da maneira mais simplificada Empty Re: Como começar meu novo script da maneira mais simplificada

Mensagem por MateusAnjosV em 07.07.18 8:16

Amei a ideia, meninos! Mas, acrescentando:

Código:
Apesar de ambos os métodos que disse anteriormente serem, pelo menos para mim a mesma coisa, procuro continuar o script executando a função .ready(). Até onde sei, o .ready executa o script quando a página estiver carregada. Isto é, uma forma mais simples de dizer. Há uma explicação mais detalhada na biblioteca do jQuery...

Código:
$(document).ready(function(){
// algo
});
Sendo mais simples e objetivo, ele executará quando o DOCUMENTO (logo, document) estiver carregado - sem necessariamente ter de esperar o carregamento das imagens, css e afins.

No caso, para sair como o exemplo que citou, basta usar:
Código:
$(window).load(function(){
// algo
});
MateusAnjosV

MateusAnjosV
Membro do Fórum

Masculino
Inscrito dia : 16/10/2015
Mensagens : 1692
Pontos Ativos : 2316

http://holder.forumeiros.com/

Como começar meu novo script da maneira mais simplificada Empty Re: Como começar meu novo script da maneira mais simplificada

Mensagem por Daemon em 07.07.18 16:32

Acredito que o que ele quis dizer foi que o "$(document).ready(function(){..." executa o script quando a página está pronta para receber o "comando", e não ao fim do carregamento. Neste caso, seria mesmo o "window load...".
Daemon

Daemon
Membro do Fórum

Masculino
Inscrito dia : 02/03/2012
Mensagens : 1127
Pontos Ativos : 1732

http://bestskins.forumeiros.com/

Como começar meu novo script da maneira mais simplificada Empty Re: Como começar meu novo script da maneira mais simplificada

Mensagem por MateusAnjosV em 08.07.18 0:08

O que você ou eu acreditamos é irrelevante. Não somos iniciantes com essa linguagem e ela é direcionada a "novos olhos". É essencial manter tudo claro, sem entrelinhas que só dificultariam o aprendizado.

E, claramente ele disse outra coisa:
Até onde sei, o .ready executa o script quando a página estiver carregada.

Mas, não vem ao caso. Não é pertinente, tampouco vale o nosso tempo discutir algo que não seja em pró do que a seção propõe.
MateusAnjosV

MateusAnjosV
Membro do Fórum

Masculino
Inscrito dia : 16/10/2015
Mensagens : 1692
Pontos Ativos : 2316

http://holder.forumeiros.com/

Como começar meu novo script da maneira mais simplificada Empty Re: Como começar meu novo script da maneira mais simplificada

Mensagem por Shek em 10.07.18 0:10

Na verdade é uma explicação breve. É claro, quem é leigo ou não conhece e que busca por conhecimento profundo, poderá entender melhor todos os detalhes na biblioteca do jQuery. Muito feliz


Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Shek Crowley
Shek

Shek
Admineiro
Admineiro

Masculino
Inscrito dia : 11/04/2009
Mensagens : 18392
Pontos Ativos : 22227

https://shiftactive.blogspot.com https://go.topicit.net/ZosT/61pMt1mPsG https://www.facebook.com/ShiftActif https://twitter.com/ShiftActif

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo


Permissão deste fórum:
Você não pode responder aos tópicos neste fórum