Análise de princípio: Etapa 1: Use o DOM para criar tags <script> ou <link> e anexe atributos a elas, como type Etapa 2: Use o método appendChild para vincular a tag a outra tag, geralmente a <head >. . aplicativo: 1. Melhore a reutilização de código e reduza a quantidade de código; 2. Adicione um controlador javascript e uma sessão para alterar dinamicamente o estilo da página; 3. Como a página carrega os arquivos sequencialmente de cima para baixo e os explica durante o carregamento, você pode adicionar um controlador JavaScript para controlar a ordem de carregamento dos arquivos da página. Por exemplo, carregue primeiro o arquivo de layout CSS e, em seguida, exiba o arquivo de embelezamento CSS. com fotos. Em seguida, carregue o arquivo falsh grande ou carregue-o de acordo com a importância do conteúdo. Dica de leitura: Iniciantes que não são bons em escrita eletrônica podem ler chinês diretamente e depois copiar o código e experimentá-lo. Para carregar um arquivo .js ou .css dinamicamente, em poucas palavras, significa usar métodos DOM para primeiro criar um novo elemento "script" ou "LINK", atribuir a ele os atributos apropriados e, finalmente, usar element.appendChild() para adicionar o elemento ao local desejado na árvore do documento Parece muito mais sofisticado do que realmente é. Aqui está uma citação: loadjscssfile("myscript.js", "js") //O navegador carrega o arquivo dinamicamente quando a página é aberta. Neste caso, podemos adicionar uma nova variável de array global e salvar o nome do arquivo vinculado nela. Antes de cada ligação, verifique se ela já existe, ele avisará que já existe. , vincule-o. Aqui está uma citação: Aqui está uma citação: Ok, continuando, às vezes a situação pode exigir que você remova ou substitua um arquivo .js ou .css adicionado. Vamos ver como isso é feito a seguir.
função loadjscssfile(nome do arquivo, tipo de arquivo){
if (filetype=="js"){ //Determina o tipo de arquivo
var fileref=document.createElement('script')//Criar tag
fileref.setAttribute("type","text/javascript")//Defina o valor do tipo de atributo como text/javascript
fileref.setAttribute("src", nome do arquivo)//O endereço do arquivo
}
else if (filetype=="css"){ //Determina o tipo de arquivo
var fileref=document.createElement("link")
fileref.setAttribute("rel", "folha de estilo")
fileref.setAttribute("tipo", "texto/css")
fileref.setAttribute("href", nome do arquivo)
}
if (typeof fileref! = "indefinido")
document.getElementsByTagName("head")[0].appendChild(fileref)
}
loadjscssfile("javascript.php", "js") // O navegador carrega dinamicamente "javascript.php" quando a página é aberta.
loadjscssfile("mystyle.css", "css") //O navegador carrega dinamicamente o arquivo .css quando a página é aberta.
A próxima tarefa é vincular à tag <head>. Um problema ao vincular é que o mesmo arquivo pode ser vinculado duas vezes por nós. Não haverá exceção se o navegador for vinculado duas vezes, mas a eficiência será baixa. para evitar
document.getElementsByTagName("head")[0].appendChild(fileref)
Referindo-se primeiro ao elemento HEAD da página e depois chamando appendChild(), isso significa que o elemento recém-criado é adicionado bem no final da tag HEAD. Além disso, você deve estar ciente de que nenhum elemento existente é prejudicado na adição da tag HEAD. novo elemento - isto é, se você chamar loadjscssfile("myscript.js", "js") duas vezes, agora você terá dois novos elementos "script", ambos apontando para o mesmo arquivo Javascript. eficiência ponto de vista, já que você adicionará elementos redundantes à página e usará memória desnecessária do navegador no processo. Uma maneira simples de evitar que o mesmo arquivo seja adicionado mais de uma vez é controlar os arquivos adicionados por loadjscssfile() e. carregue apenas um arquivo se for novo:
var filesadded="" //Salva a variável de array que possui nomes de arquivos vinculados
function checkloadjscssfile(nome do arquivo, tipo de arquivo){
if (filesadded.indexOf("["+filename+"]")==-1){//indexOf determina se há um item na matriz
loadjscssfile(nome do arquivo, tipo de arquivo)
filesadded+="["+filename+"]" //Adiciona o nome do arquivo a filesadded
}
outro
alert("arquivo já adicionado!") // Avisa se já existe
}
checkloadjscssfile("myscript.js", "js") //sucesso
checkloadjscssfile("myscript.js", "js") //arquivo redundante, então arquivo não adicionado
Aqui estou apenas detectando grosseiramente para ver se um arquivo definido para ser adicionado já existe em uma lista de nomes de arquivos adicionados armazenados na variável filesadded antes de decidir se devo prosseguir ou não.