`

实战javascript之动态加载js和动态加载css

阅读更多

在整合ajax的项目中,动态加载js和动态加载css是必须的

动态加载js

// 动态加载JS
function add_js(name) {
	var head = document.getElementsByTagName('head').item(0);
	var headlist = head.childNodes;
	for(var i = 0;i < headlist.length;i = i+1){
		if(headlist[i] != "" && headlist[i].type == "text/javascript"){
			if(headlist[i].src.indexOf(name) > -1){						
				head.removeChild(headlist[i]);
				break;
			}
		}
	}
	var oscript= document.createElement("script");
	oscript.type = "text/javascript";
	oscript.src = name;
	head.appendChild(oscript);	
}

动态加载css

 

//动态加载样式
function add_css(name) {
	var head = document.getElementsByTagName('head').item(0);
	var headlist = head.childNodes;
	for(var i = 0;i < headlist.length;i = i+1){
		if(headlist[i] != "" && headlist[i].type == "text/css"){
			if(headlist[i].href != null && headlist[i].href.indexOf(name) > -1){
				return;
			}
		}
	}
	var ocss = document.createElement("link");
	ocss.type = "text/css";
	ocss.rel = "stylesheet";
	ocss.href = name;
	head.appendChild(ocss);
}



分享到:
评论

相关推荐

    html+css+javascript 电商网站web+mobile实战项目

    在本项目中,“html+css+javascript 电商网站web+mobile实战项目”是一个全面的教程,旨在帮助初学者掌握HTML、CSS和JavaScript的基础知识,并通过实际电商网站的开发,了解Web和移动端页面的构建。这个实战项目涵盖...

    《JavaScript和jQuery实战手册》PDF

    《JavaScript和jQuery实战手册》是一本深入探讨JavaScript和jQuery编程技术的专业书籍,旨在帮助读者掌握这两门重要技术,提升Web开发能力。JavaScript是互联网上最广泛使用的脚本语言,而jQuery则是JavaScript的一...

    详细的HTML+CSS+JavaScript网页设计.pdf

    JavaScript为网页添加交互性,使其更加动态和有趣。以下是该网页中可实现的JavaScript功能: - **导航栏平滑滚动**:当点击导航栏中的链接时,页面平滑滚动到对应部分。 - **模态窗口**:为项目展示添加点击图片后...

    javascript项目实战 模板

    4. **响应式布局**:通过JavaScript和CSS3实现响应式设计,适应不同设备和屏幕尺寸。 5. **模块化开发**:讲解CommonJS、AMD或ES6模块系统,使代码组织更有序,易于维护。 6. **MV*框架应用**:如React、Vue或...

    JavaScript实战.pdf

    ### JavaScript实战知识点解析 #### 一、书籍基本信息 - **书名**:《JavaScript实战》 - **出版时间**:2009年4月1日 - **ISBN**:9787802057333 - **开本**:16开 - **定价**:72.00元 #### 二、书籍概述 ...

    H5前端高级入门实战案例_加载页面动画Ⅴ(css+js).rar

    总之,"H5前端高级入门实战案例_加载页面动画Ⅴ(css+js)"是一个很好的起点,让初级前端工程师能够掌握基本的HTML5、CSS3和JavaScript动画技巧。通过实践这个案例,你不仅能学会创建一个动态加载页面的效果,还能...

    JavaScript实战项目之泡泡效果

    在本实践项目“JavaScript实战项目之泡泡效果”中,我们将探讨如何使用HTML、CSS和JavaScript技术来创建一个动态的泡泡动画效果。这个项目适合初学者和有一定基础的开发者,通过它,你可以提升对前端开发的理解,...

    JavaScript动态网页编程

    JavaScript,简称JS,是Web开发中的核心技术之一,用于实现网页的动态效果和交互性。它是一种轻量级的解释型编程语言,主要应用于客户端的浏览器环境中,为用户提供丰富的用户体验。本压缩包“精通JavaScript动态...

    仿京东数码网页动态网页效果,纯css+html+JavaScript

    标题中的“仿京东数码网页动态网页效果,纯css+html+JavaScript”指的是使用HTML、CSS和JavaScript这三种前端核心技术来创建一个与京东数码页面类似的功能和视觉效果的动态网页。这个项目旨在展示如何通过这些技术...

    妙味视频+JavaScript+jquery+html5+css3视频教程(88GB)+项目实战

    例如,在 JavaScript 和 jQuery 的项目实战中,可能会包括: - **网页动态效果:** 如轮播图、弹窗提示等。 - **表单验证:** 使用 JavaScript 对用户输入进行验证,提高用户体验。 - **Ajax 请求:** 发送异步请求...

    淘宝首页html+css+js源码

    淘宝首页的HTML+CSS+JS源码是一套用于学习和实战前端开发的资源,它基于2019年06月的淘宝网首页设计,力求还原度高达99%。这个项目不仅包含了基本的HTML结构,还融合了CSS样式表和JavaScript脚本,使得页面动态效果...

    JavaScript实战项目之仿淘宝首页

    在本实践项目“JavaScript实战项目之仿淘宝首页”中,我们将深入探讨JavaScript、HTML、CSS等前端技术在构建复杂交互式网页中的应用。这个项目旨在帮助开发者提升在大前端领域中的实际开发技能,通过模仿淘宝首页的...

    HTML5+CSS动画最佳实战

    总结来说,“HTML5+CSS动画最佳实战”涵盖了从基础到进阶的HTML5和CSS动画知识,通过学习和实践,开发者可以掌握创建各种互动效果和动态图形的技巧,提升网页的用户体验和视觉吸引力。无论你是网页设计师还是前端...

    js+css滤镜实现动态图片显示

    【标题】"js+css滤镜实现动态图片显示"是一个关于使用JavaScript和CSS技术来创建动态图片效果的技术主题。在Web开发中,动态图片显示能够为用户带来更丰富的交互体验,比如图片渐变、动画过渡等。这个话题涉及到前端...

    html css javascript web网页设计案例大全

    在"javascript"相关的案例中,你将接触到AJAX(Asynchronous JavaScript and XML)、事件处理、函数、对象和类等核心概念,学习如何创建动态网页。 4. Web实用网页设计方法:这通常指的是在实际项目中应用的设计...

    《精通JavaScript动态网页编程(实例版)》光盘源码

    2. **AJAX(异步JavaScript和XML)**:AJAX技术允许网页在不重新加载整个页面的情况下与服务器交换数据并更新部分网页内容。通过创建XMLHttpRequest对象,JavaScript可以实现后台与服务器的通信,提高用户体验,使得...

    前端购书网站源码(HTML+CSS+JavaScript).rar

    - 使用现代JavaScript库或框架如jQuery、Vue.js、React.js等,以提高代码的可维护性和性能。 4. **响应式设计**: 为了适应不同设备的屏幕大小,如手机、平板、桌面电脑,源码可能采用了响应式设计。这可能通过设置...

    HTML+JS+CSS实现魔塔50层demo

    HTML、JavaScript 和 CSS 是网页开发的三大核心技术,用于构建交互式和动态的Web应用程序。在这个“HTML+JS+CSS实现魔塔50层demo”项目中,开发者利用这些技术创建了一个经典的像素风格游戏——魔塔的50层版本。下面...

    京东首页项目实战 HTML+CSS+JS

    在本项目实战中,我们将深入探讨“京东首页项目实战”,主要涉及前端开发技术,包括HTML、CSS和JavaScript。这三个核心技术是构建任何现代网页应用的基础,尤其是对于像京东这样的大型电商平台的首页。 首先,HTML...

Global site tag (gtag.js) - Google Analytics