Muitas vezes neste site, vejo pessoas tentando fazer coisas assim:
<script type="text/javascript">
$(document).ready(function(){
$('<?php echo $divID ?>').click(funtion(){
alert('do something');
});
});
</script>
Eu não acho que esse seja algum tipo de padrão em que as pessoas naturalmente se enquadram. Deve haver algum tipo de tutorial ou material de aprendizagem por aí que mostre isso, caso contrário, não veríamos tanto. O que estou perguntando é: estou lidando muito com isso ou é uma prática muito ruim?
Edição: estava falando com um amigo meu sobre isso, que muitas vezes coloca ruby em seu JavaScript e ele trouxe esse ponto.
Não há problema em colocar dinamicamente constantes amplas do aplicativo em seu JavaScript para que você não precise editar dois arquivos. por exemplo...
MYAPP.constants = <php echo json_encode($constants) ?>;
também é bom codificar diretamente os dados que você planeja usar em uma biblioteca
ChartLibrary.datapoints = <php echo json_encode($chartData) ?>;
ou devemos fazer uma ligação AJAX sempre?
fonte
this question will likely solicit opinion, debate, arguments, polling, or extended discussion.
...Respostas:
Normalmente, é uma má prática usar o idioma X para gerar código no idioma Y.
Tente dissociar os dois idiomas, transformando os dados em sua única interface - não misture o código .
No seu exemplo, você pode melhorar o código usando o PHP para preencher uma
cfg
estrutura que está disponível para JavaScript:Dessa forma, o PHP se preocupa apenas com o preenchimento da estrutura de dados e o JavaScript se preocupa apenas com o consumo da estrutura de dados.
Essa dissociação também abre caminho para carregar os dados de forma assíncrona (JSON) no futuro.
Atualizar:
Para responder às perguntas adicionais que você fez com sua atualização, sim, seria uma boa prática aplicar o princípio DRY e permitir que PHP e JavaScript compartilhem o mesmo objeto de configuração:
Não há mal nenhum em inserir a representação JSON de sua configuração diretamente em sua página como esta. Você não precisa necessariamente buscá-lo via XHR.
fonte
data-
atributo no seu HTML. Algo como<body data-cfg="{...}">
.JavaScript gerado dinamicamente é uma prática horrível e ruim.
O que você deve fazer é compreender o que significa Separação de preocupações e aprimoramento progressivo.
Isso basicamente significa que você tem HTML dinâmico e JavaScript estático (que aprimora o HTML).
No seu caso, você provavelmente deseja uma classe em sua div e seleciona-a com um seletor de classe
fonte
O maior problema com seu snippet é que você está faltando
#
para torná-lo um seletor jQuery válido;).Eu diria que você deve evitar incluir o PHP no seu JavaScript sempre que possível. O que há de errado em alterar o seletor em seu
click()
manipulador para uma classe e adicionar a classe ao elemento em questão se você deseja que o manipulador seja acionado, e não se não;Não são as circunstâncias em que você precisa para incluir PHP em sua JavaScript; mas devo admitir que estes são poucos e distantes entre si.
Um exemplo é quando você tem ambientes diferentes; testar, encenar e viver. Cada um deles tem um local diferente de seus ativos (imagens, principalmente). A maneira mais fácil de definir o caminho para que possa ser usado pelo JavaScript é algo como;
fonte
#
=), mas sério, eu concordo que seu exemplo é a melhor maneira de fazê-lo. Parece-me mais natural fazê-lo dessa maneira também. Então, por que o vemos com tanta frequência em lugares onde não é necessário?$divID = '#' . $element_id_value;
- sem problemas com o chefe do seletor;)Essa é uma prática ruim, na minha opinião, pois você precisaria chamar esse arquivo de algo.php e não poderá compactá-lo, por exemplo, sem mencionar que não é bom misturar as coisas do servidor com o JavaScript. Tente limitar a mistura entre PHP e JS, tanto quanto possível.
Você sempre pode fazer isso:
E então você poderia chamar essa função em um arquivo php, para tornar essas coisas de mistura o mais pequenas possível.
Ao fazer isso (com arquivos JS maiores, e não de duas a três linhas onde isso não importa), você pode aproveitar a compactação do arquivo JS e os desenvolvedores de front-end se sentem muito confortáveis trabalhando apenas com JavaScript na minha opinião (como você poderia escrever Python, Ruby, etc., não apenas o PHP - e o código pode ficar cada vez maior, dependendo do que você precisa fazer lá).
fonte
Eu não acho que isso seja uma prática ruim. Se o ID necessário no seu JavaScript for dinâmico, não há outra maneira de fazer isso.
fonte
Eu consideraria essa má prática. Ao colocar conteúdo dinâmico dentro de blocos de script, você sempre deve estar ciente do fato de que escapar dentro de um contexto javascript não é tão simples quanto você esperaria. Se os valores foram fornecidos pelo usuário, é não suficiente para html-escapar deles.
A folha de dicas do OWASP XSS tem mais detalhes, mas basicamente você deve adotar este padrão:
Em um arquivo .js separado, vinculado a partir do html principal, carregue este código:
O motivo do uso de um arquivo .js separado é duplo:
fonte
$.ajax
ou similarAlgumas pessoas argumentam que é uma má prática. Não porque é PHP dentro de JS, mas porque é JS embutido e, portanto, não será armazenado em cache pelo navegador para facilitar o carregamento da próxima vez.
Na IMO, é sempre melhor usar JSON para passar variáveis entre os dois idiomas, mas acho que depende de você.
fonte
Eu diria que, em geral, não faça isso. No entanto, se você deseja passar dados do PHP -> Javascript, não seria uma loucura ter um bloco Javascript embutido, onde você tem o código do formulário mostrado abaixo. Aqui o código está apenas passando dados do php para o javascript, não criando lógica em tempo real ou algo semelhante. A parte boa de fazer isso x uma chamada ajax é que os dados estão disponíveis assim que a página é carregada e não exigem uma viagem extra ao servidor.
Obviamente, uma outra opção é criar um arquivo de configuração javascript do PHP por meio de alguma forma de script de construção que o colocará em um arquivo .js.
fonte
A única coisa em que consigo pensar que pode realmente causar problemas é quando os erros do PHP são definidos para serem exibidos e, portanto, empurra uma carga de HTML mostrando o erro do PHP no seu JavaScript.
Também porque é no script, portanto, não é exibido e, às vezes, pode demorar um pouco para perceber por que seu script está quebrado.
fonte
Depende de quem, e se você me perguntar, sim, considero a prática de volta por alguns motivos. Primeiro de tudo, eu preferiria ter o código javascript em seu próprio arquivo JS que o analisador php não seria capaz de tocar.
Em segundo lugar, o php é executado apenas no horário do servidor; portanto, se você estiver dependendo de alguma variável do php para alterar seu javascript, isso pode não funcionar muito bem. Se houver alguma configuração de carregamento de página que você deseja controlar com javascript, normalmente prefiro adicionar esse valor ao DOM com php para que o javascript possa alcançá-lo quando e se desejar (em uma div oculta, por exemplo).
Finalmente, apenas para fins organizacionais, isso pode ser muito irritante. Já é ruim o suficiente misturar html e php (na minha opinião).
fonte
A contenção do PHP em um
config
objeto de dados ocorre 90%, mas a melhor prática é separá-lo completamente. Você pode usar uma API RESTful para solicitar apenas os dados necessários, é um pouco mais javascript, mas com algumas vantagens.Desvantagens:
Roteiro
fonte
Não é uma prática ruim SOMENTE se for usado para a inicialização do código javascript (nos meus temas do WordPress, inicializo meus objetos javascript com funções php como site_url () porque é a única maneira de lidar com isso (talvez possamos usar uma solicitação ajax para obter um json, e assim ... mas é um pé no saco).
Boa prática:
novo javascriptObject ("");Má prática:
/ * algum código * / document.get_element_by_id (); / * algum código * /fonte