Umar Hansa
Essas são essencialmente operações de recortar/copiar e colar.
Você pode mudar o DOM com facilidade sem precisar editar o HTML como uma string gigante.
- Clique com o botão direito do mouse em um nó e selecione Copy.
- Você pode colar no seu editor de código ou, para criar protótipos, colar o nó DOM em outro lugar na árvore do DOM. O nó colado é inserido como um filho do nó selecionado no momento. No vídeo, eu uso a tecla de seta para a esquerda para pular para a tag de abertura mãe imediata e colar nela (que é o que faço na maioria dos casos).
Você também pode recortar (clique com o botão direito do mouse > Cortar, Cmd + x/Ctrl + x) um nó DOM e colar, o que tem o efeito de mover o nó.
Experiência: tente adicionar mais links no cabeçalho/rodapé de um site usando essa técnica de copiar e colar e descubra em que ponto o layout precisa ser melhorado.