- 浏览: 171731 次
- 性别:
- 来自: 成都
-
文章分类
最新评论
-
crabboy:
goodhttp://veerle.duoh.com/comm ...
表格效果 -
lunvsxiao:
好呀,省的自己记那么多了。。
java常用正则表达式
动态加载javascript?很俗的一个题目,如果你已经知道如何动态加载外部javascript,那么你可以跳过这篇文章继续阅读其它的。如果你还不知道怎样动态加载外部javascript文件的话,请耐心的继续阅读。
什么时候会用到动态加载javascript文件的技术呢?其实很多的时候都有可以用到,比如从服务器端生成javascript脚本,但是用到动态加载javascript文件主要是因为前端和后端数据的交互(至少哥会在这个时候用到)。
前几天在修改移动版支付宝时,就使用了动态加载javascript文件。
记住,这里说的动态加载js文件是指利用js动态加载js文件,并非是服务器生成。
如何创建动态加载外部javascript的脚本呢?非常简单
var script = document.createElement('script');//创建script标签 script.src = 'http://mgw.alipay.com/choosePhone.htm?' + (new Date()).getTime().toString().substring(0,8); script.type = "text/javascript"; script.characterSet = 'utf-8'; script.onload = script.onreadystatechange = function(){//兼容IE和DOM标签的script onload事件 if (!this.readyState || this.readyState == 'loaded' || this.readyState == 'complete') { alert(malipayBrands.length); } }
请注意以上代码中的script.onload = script.onreadystatechange = function (){},其中onload用于DOM标签的浏览器,onreadystatechange用于IE。
最后在head中插入我们的script
document.getElementsByTagName('head')[0].appendChild(script);
在国外已经有一个封装好的loadScript.js,代码如下:
function loadScript(url, callback){ var f = arguments.callee; if (!("queue" in f)) f.queue = {}; var queue = f.queue; if (url in queue) { // script is already in the document if (callback) { if (queue[url]) // still loading queue[url].push(callback); else // loaded callback(); } return; } queue[url] = callback ? [callback] : []; var script = document.createElement("script"); script.type = "text/javascript"; script.onload = script.onreadystatechange = function(){ if (script.readyState && script.readyState != "loaded" && script.readyState != "complete") return; script.onreadystatechange = script.onload = null; while (queue[url].length) queue[url].shift()(); queue[url] = null; }; script.src = url; document.getElementsByTagName("head")[0].appendChild(script); }
发表评论
-
img 图片显示多余空白解决方法
2014-09-03 23:01 0img 图片显示多余空白解决方法:在进行DIV+CSS排版时 ... -
js event.keyCode
2011-12-02 17:13 709keycode 8 = BackSpace BackSpace ... -
js event.keyCode
2011-12-02 17:06 2keycode 8 = BackSpace BackSpace ... -
IE6下png透明处理心得
2011-11-24 12:41 1327首先说明一下,网上处理IE6下png透明的方法有很多,但无外乎 ... -
我的笔记
2011-10-25 22:52 0http://www.ccxcn.com/blog/post/ ... -
HTTP状态码(HTTP Status Code)
2011-02-23 09:40 7171xx(临时响应)表示临时响应并需要请求者继续执行操作的状态代 ... -
上传图片预览-兼容IE6,IE7,IE8,FF
2011-01-20 14:07 727<!DOCTYPE html PUBLIC " ... -
Apache相关配置
2010-11-30 22:15 748强制IE缓存CSS中定义的图片 document.execC ... -
表格效果
2010-07-14 18:07 818web应用中的表格效果。 鼠标滑动时选中横行和竖列。 见附 ... -
所有浏览器中都能正常显示的字体
2010-07-04 01:31 1029很佩服国外一些前端开发人员对待学问的研究精神,他们很善于总结发 ... -
隐藏IE窗口自带的“Windows Internet Explorer”
2010-05-17 10:34 1739var whiteStr = ""; f ... -
当加载flash或者弹出窗口时,Internet Explorer显示安全提示
2010-05-05 11:50 1944当我们在开发web前端时,有时加载的swf文件或者某些js文件 ... -
子页面和父页面的相互调用
2010-04-07 13:53 2466父页面 <!DOCTYPE html PUBLI ... -
CSS选择器笔记
2010-03-20 11:17 1416http://www.456bereastreet.com/a ... -
美化表单
2010-01-14 22:42 1291首先介绍一个设计很不错的网站:http://utombox.c ... -
你是如何让position:fixed在IE6中工作的
2010-01-09 17:20 2297你是如何让position:fixed在IE6中工作的? 本 ... -
动态加载css的实现思路
2010-01-04 15:50 1465动态加载css的实现思路,目前想到有两种: 一、js 主要 ... -
滚动列表
2010-01-04 13:13 1146<MARQUEE onmouseover=this.st ... -
淡入淡出DIV层效果
2009-12-29 18:09 2145<html> <head> &l ... -
生成Table,然后赋值
2009-12-23 10:42 1414主要用于需要对比的时候: <!DOCTYPE H ...
相关推荐
这正是"javascript函数动态加载javascript文件"这一主题的核心所在。 动态加载JavaScript文件的基本原理是利用`<script>`标签的异步加载特性或者使用`XMLHttpRequest`或`fetch` API来创建HTTP请求获取JS文件。下面...
动态加载JavaScript文件是提高网页性能和优化...总结,动态加载JavaScript文件可以提升网页性能,但需谨慎处理,特别是在涉及用户安全的数据操作时。合理使用这两种方法,结合安全策略,可以在性能与安全之间找到平衡。
基于Ajax的动态JavaScript文件加载模型 Ajax异步请求 JavaScript文件加载模型是基于B/S模式的系统中的一个重要组件。在浏览器端,JavaScript文件是浏览器端程序的主要组成部分。传统的方式是将所有可能用到的...
动态加载则改变了这一模式,它使用JavaScript代码来异步请求并插入外部脚本,使得页面可以先呈现基本内容,而JavaScript文件则在后台加载,提高了用户体验。 二、动态加载的方法 1. 使用`<script>`标签的`async`和...
需要注意的是,动态加载的JavaScript文件的执行顺序依赖于它们被添加到DOM中的顺序,因此在多个脚本的加载和执行管理上需要特别注意。另外,如果JavaScript文件较大或者网络状况不佳,可能会延长页面加载时间,影响...
动态加载外部JavaScript文件是一种常用的技术手段,它允许在不重新加载整个页面的情况下,动态地将JavaScript文件添加到网页中。这对于提高页面加载速度、按需加载资源、减少初始加载时间等方面非常有效。 在介绍...
动态加载JavaScript文件是前端开发中常用的技术之一,它允许我们在页面加载完成后根据需要再加载特定的JS文件,从而优化页面的加载时间和性能。本文将详细介绍三种动态加载JavaScript文件的方法:使用document.write...
因此,需要在运行时动态地将新的JavaScript文件添加到DOM中,以实现按需加载。 实现Vue动态加载JavaScript的基本步骤如下: 1. 创建Script元素:在JavaScript中,我们可以使用`document.createElement('script')`...
JavaScript 动态加载是一种优化网页性能和管理大量脚本的方法,它允许我们在需要时才加载特定的 JavaScript 文件,而不是一次性在页面加载时全部加载。这有助于减少初始页面加载时间,提高用户体验,特别是在处理...
最后,将这个script元素添加到document.head中,从而实现动态加载JavaScript文件。 对于CSS文件的动态加载,操作则略有不同。需要创建一个link元素,并设置其rel属性为"stylesheet",type属性为"text/css",media...
通过版本控制动态加载Javascript文件和功能 该库将根据列出的依赖关系动态加载javascript文件(和函数),css和图像,同时还生成用于浏览器缓存版本控制的唯一文件名。 概述 Javascript代码通常取决于现有类,函数和...
动态加载JavaScript文件时,常见的一种做法是使用JavaScript创建一个`<script>`标签,并将文件的URL赋给该标签的`src`属性,然后将这个标签动态地添加到HTML文档的`<head>`部分或者`<body>`部分。例如: ```...
JavaScript控件开发是一种常见的Web应用开发技术,它...在"script"和"web"这些文件中,可能包含了实现上述功能的示例代码或文档,深入学习和研究这些文件,将有助于你更好地理解和实践JavaScript控件的动态加载技术。
传统上,加载Javascript文件都是使用[removed]标签。 就像下面这样: [removed][removed] [removed]标签很方便,只要加入网页,浏览器就会读取并运行。但是,它存在一些严重的缺陷。 (1)严格的读取顺序。由于...
在前端开发中,有时我们需要动态地加载外部JavaScript库或脚本文件。特别是在构建大型Vue应用程序时,可能会遇到需要按需加载某些功能的情况,例如第三方库、API接口等。本文将详细介绍如何通过创建一个Vue组件来...
以下是一个简单的示例,展示了如何使用jQuery动态加载JavaScript文件: ```html <script type="text/javascript" src="jquery-1.7.2.min.js"> 利用 jQuery 动态加载 js <div id="content"></div> ...
在开发过程中,有时我们可能需要在运行时动态加载JavaScript文件,以提高页面性能或根据用户需求加载特定的脚本。本文将详细介绍几种在JavaScript中动态加载JS文件的方法。 1. **利用`document.write`** 这是最...