1. Execute o código JavaScript na barra de endereço do navegador
Muitas pessoas ainda devem saber disso. Você pode executar o código JavaScript diretamente na barra de endereço do navegador, começando com javascript: seguido pela instrução a ser executada. tal como:
javascript:alert('hello from address bar :)');
Cole o código acima na barra de endereço do navegador e pressione Enter. O alerta será executado normalmente e uma janela pop-up será exibida.
Você vai tentar, não há janela pop-up? ? ?
isso é porque:
Se você copiar e colar o código na barra de endereço do navegador, o
IE e o Chrome removerão automaticamente o javascript: no início do código, portanto, você precisa adicioná-lo manualmente para executá-lo corretamente
. Embora o Firefox não o remova automaticamente, ele não o suporta. Execute o código JS na barra de endereço,
suspiro ~
2. Execute o código HTML na barra de endereço do navegador
Se há muitas pessoas que conhecem o segredinho acima, há menos pessoas que conhecem esse segredo. Você pode executar o código HTML diretamente na barra de endereço de navegadores com kernels não-IE!
Por exemplo, digite o seguinte código na barra de endereço e pressione Enter para executar, o conteúdo da página especificada aparecerá.
data:text/html,<h1>Hello, world!</h1>Terceiro, use o navegador como editor
Ainda fazendo barulho na barra de endereços do navegador, cole o seguinte código na barra de endereços e execute-o, o navegador se torna um editor primitivo e simples, assim como o bloco de notas que vem com o Windows, rugido.
data:text/html, <html contenteditable>
Na análise final, graças ao contenteditableatributo recém-adicionado no HTML5 , quando o elemento é especificado com esse atributo, o conteúdo do elemento se torna editável.
Por extensão, após colocar o código a seguir em consoleexecução, a página inteira se tornará editável, atropele-a à vontade ~
document.body.contentEditable='true';
Quarto, use a tag a para analisar automaticamente o URL
Muitas vezes temos a necessidade de extrair nomes de domínio, palavras-chave de consulta, valores de parâmetros variáveis, etc. de um URL, mas nunca esperamos que o navegador pudesse nos ajudar facilmente a concluir essa tarefa sem ter que escrever regulares para rastrear. O método é criar uma tag a no código JS e atribuir a URL a ser analisada ao atributo href de a, e então obteremos tudo o que queremos.
var a = document.createElement('a');
a.href = 'http://github.com/fly-sy/code';
console.log(a.host);
Quinto, o elemento com ID na página criará variáveis globais
Em uma página HTML, todos os elementos com atributos de ID criarão variáveis globais correspondentes no ambiente de execução JavaScript, o que significa que document.getElementById é redundante como um apêndice humano. Mas em projetos reais, é melhor escrevê-lo como deveria.Afinal, há muito menos chance de problemas no código convencional.
<div id="sample"></div>
<script type="text/javascript">
console.log(sample);//直接写id名即可获取到元素
</script>6. Ao carregar arquivos CDN, você pode omitir o logotipo HTTP
O CDN popular é para carregar alguns arquivos JS e CSS gerais de um servidor dedicado. Por motivos de segurança, alguns servidores CDN usam conexão HTTPS e alguns são HTTP tradicional. Na verdade, podemos ignorar isso ao usá-lo e alterá-lo. Omita do URL.
<script src="//cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
Sete, não declare a troca de valor da terceira variável
Todos nós conhecemos a prática normal de trocar os valores de duas variáveis, ou seja, declarar uma variável intermediária para armazenar temporariamente. Mas poucas pessoas desafiam a situação de não declarar variáveis intermediárias.O código a seguir mostra essa implementação. Muito criativo.
var a=1,b=2;a=[b,b=a][0];
8. Proíba que outras pessoas carreguem sua página com iframe
O código abaixo é autoexplicativo, não há muito a dizer.
if (window.location != window.parent.location) window.parent.location = window.location;
九 、 console.table
Exclusivo do Chrome, método de console de ignorar o IE. Você pode gerar arrays associativos JavaScript para o console do navegador em formato tabular.O efeito é incrível e a interface é linda. Como ~ como ~ como ~
var data = [{'品名': ' ', '数量': 4}, {'品名': ' ', '数量': 3}];
console.table(data);