Maison interface Web js tutoriel 异步动态加载js与css文件的js代码_javascript技巧

异步动态加载js与css文件的js代码_javascript技巧

May 16, 2016 pm 05:22 PM
css js

jquery动态加载css,js文件方法简单很,

方法1:

代码如下

复制代码 代码如下:

$.getscript("test.js");

方法2:

代码如下

复制代码 代码如下:

function loadjs(file){

var head = $('head').remove('#loadscript');

$(""+""+"ipt>").attr({src:file,type:'text/javascript',id:'load'}).appendto(head);

}

方法3:

代码如下

复制代码 代码如下:

$(""+""+"ipt>").attr({src:file,type:'text/javascript',id:'load'}).appendto($('head').remove('#loadscript'));

 

下面附一些js动态加载js,css文件的方法。

以下代码是摘自news.qq.com页面里的代码的,本人未进行测试,程序看着应该没有问题的,可以做为参考的,主要用来在网页底部位置,实现动态加载js文件到网页

标签的后面,通过DOM来实现的,代码如下:

代码如下

复制代码 代码如下:

<script><BR>var SCRIPT_TIMEOUT = 20000;<BR>var QVPL_PATH = "/QVPL1.0.0.js"; <P>function loadHelper (jsurl) {<BR>var oScriptEl, oTimeoutHDL, oHead;<BR>oScriptEl = document.createElement("script");<BR>oScriptEl.type = "text/javascript";<BR>oScriptEl.language = "javascript";<BR>oScriptEl.src = jsurl;<BR>oScriptEl.onreadystatechange = doCallback; <P>oScriptEl.onload = function()<BR>{<BR>this.readyState = "complete";<BR>doCallback();<BR>if(typeof(lianbo) == "object"){<BR>lianbo.init(window.QVPL);<BR>}<BR>}; <P>oTimeoutHDL = window.setTimeout(doError,SCRIPT_TIMEOUT);<BR>document.getElementsByTagName("head")[0].appendChild(oScriptEl); <P>function doCallback()<BR>{<BR>if (oScriptEl.readyState == "complete" || oScriptEl.readyState == "loaded")<BR>{<BR>oScriptEl.onload = oScriptEl.onreadystatechange = new Function();<BR>window.clearTimeout(oTimeoutHDL);<BR>}<BR>}; <P>function doError()<BR>{<BR>oScriptEl.parentNode.removeChild(oScriptEl);<BR>};<BR>} <P>loadHelper(QVPL_PATH);<BR></script>
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
2 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Meilleurs paramètres graphiques
2 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Comment réparer l'audio si vous n'entendez personne
2 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Comment afficher correctement le 'Jingnan Mai Round Body' installé localement sur la page Web? Comment afficher correctement le 'Jingnan Mai Round Body' installé localement sur la page Web? Apr 05, 2025 pm 10:33 PM

En utilisant récemment des fichiers de police installés localement dans les pages Web, j'ai téléchargé une police gratuite à partir d'Internet et je l'ai installée avec succès dans mon système. Maintenant...

Comment sélectionner un élément enfant avec l'élément de nom de première classe via CSS? Comment sélectionner un élément enfant avec l'élément de nom de première classe via CSS? Apr 05, 2025 pm 11:24 PM

Lorsque le nombre d'éléments n'est pas fixé, comment sélectionner le premier élément enfant du nom de classe spécifié via CSS. Lors du traitement de la structure HTML, vous rencontrez souvent différents éléments ...

La production de pages H5 nécessite-t-elle une maintenance continue? La production de pages H5 nécessite-t-elle une maintenance continue? Apr 05, 2025 pm 11:27 PM

La page H5 doit être maintenue en continu, en raison de facteurs tels que les vulnérabilités du code, la compatibilité des navigateurs, l'optimisation des performances, les mises à jour de sécurité et les améliorations de l'expérience utilisateur. Des méthodes de maintenance efficaces comprennent l'établissement d'un système de test complet, à l'aide d'outils de contrôle de version, de surveiller régulièrement les performances de la page, de collecter les commentaires des utilisateurs et de formuler des plans de maintenance.

Comment faire une barre de progression avec H5 Comment faire une barre de progression avec H5 Apr 06, 2025 pm 12:09 PM

Créez une barre de progression à l'aide de HTML5 ou CSS: créez un conteneur de barre de progression. Définissez la largeur de la barre de progression. Créez des éléments internes de la barre de progrès. Définit la largeur des éléments internes de la barre de progression. Utilisez la bibliothèque JavaScript, CSS ou Progress Bar pour afficher les progrès.

Comment compatible avec l'omission de débordement multi-lignes sur le terminal mobile? Comment compatible avec l'omission de débordement multi-lignes sur le terminal mobile? Apr 05, 2025 pm 10:36 PM

Problèmes de compatibilité du débordement multi-rangs sur le terminal mobile omis sur différents appareils Lors du développement d'applications mobiles à l'aide de Vue 2.0, vous rencontrez souvent la nécessité de déborder de texte ...

Quels scénarios d'application conviennent à la production de pages H5 Quels scénarios d'application conviennent à la production de pages H5 Apr 05, 2025 pm 11:36 PM

H5 (HTML5) convient aux applications légères, telles que les pages de campagne de marketing, les pages d'affichage des produits et les micro-Websites de promotion d'entreprise. Ses avantages résident dans la plateformité multi-plateaux et une riche interactivité, mais ses limites résident dans des interactions et des animations complexes, un accès aux ressources locales et des capacités hors ligne.

Comment régler la bordure de la table H5 Comment régler la bordure de la table H5 Apr 06, 2025 pm 12:18 PM

Dans HTML, définissez les bordures de la table H5 via CSS: introduisez une feuille de style CSS, style la bordure en utilisant les attributs de bordure (y compris les sous-propriétés de la largeur de la bordure, de la bordure et de la bordure des bordures) et appliquez le style aux éléments de la table. De plus, des styles de frontières spécifiques peuvent être définis, tels que la frontière, la frontière droite, la frontière et la frontière-gauche.

Comment résoudre le problème de compatibilité H5 Comment résoudre le problème de compatibilité H5 Apr 06, 2025 pm 12:36 PM

Les solutions aux problèmes de compatibilité H5 comprennent: l'utilisation de conception réactive qui permet aux pages Web d'ajuster les dispositions en fonction de la taille de l'écran. Utilisez des outils de test de croisement pour tester la compatibilité avant la libération. Utilisez Polyfill pour fournir un support pour les nouvelles API pour les navigateurs plus âgés. Suivez les normes Web et utilisez du code efficace et des meilleures pratiques. Utilisez des préprocesseurs CSS pour simplifier le code CSS et améliorer la lisibilité. Optimiser les images, réduire la taille de la page Web et accélérer le chargement. Activez HTTPS pour assurer la sécurité du site Web.

See all articles