原文:   Dynamically loading an external JavaScript or CSS file

通过javascript动态加载css文件和javascript文件,主要是通过javascript在HTML的Head标签中间插入下面的代码,达到引入css和javascript效果

<link href="SNJStyles.css" type="text/css" rel="stylesheet">

<script src="js/jquery-1.8.3.min.js" type="text/javascript"></script>

实现代码:

 function loadjscssfile(filename, filetype){
if (filetype=="js"){ //if filename is a external JavaScript file
var fileref=document.createElement('script')
fileref.setAttribute("type","text/javascript")
fileref.setAttribute("src", filename)
}
else if (filetype=="css"){ //if filename is an external CSS file
var fileref=document.createElement("link")
fileref.setAttribute("rel", "stylesheet")
fileref.setAttribute("type", "text/css")
fileref.setAttribute("href", filename)
}
if (typeof fileref!="undefined")
document.getElementsByTagName("head")[0].appendChild(fileref)
} // 使用例子
loadjscssfile("myscript.js", "js") //dynamically load and add this .js file
loadjscssfile("javascript.php", "js") //dynamically load "javascript.php" as a JavaScript file
loadjscssfile("mystyle.css", "css") ////dynamically load and add this .css file

Dynamically loading an external JavaScript or CSS file的更多相关文章

  1. How to load a local .CSS file & JavaScript resources using iPhone UIWebView Class

    This post will cover the basic setup and creation of an application with web content for iPhone that ...

  2. ResolveUrl in external JavaScript file in asp.net project

    https://stackoverflow.com/questions/11263425/page-resolveurl-is-not-working-in-javascript The proble ...

  3. Odometer使用JavaScript和CSS制作数字滑动效果

    Odometer是一个使用JavaScript和CSS技术,制作出数字上下滑动的动画效果插件,有点类似与我们的天然气的读数的动画效果,这个插件是轻量级的,压缩版本只有3kg,使用CSS3动画技术,所以 ...

  4. 四种常见的提示弹出框(success,warning,error,loading)原生JavaScript和jQuery分别实现

    原文:四种常见的提示弹出框(success,warning,error,loading)原生JavaScript和jQuery分别实现 虽然说现在官方的自带插件已经有很多了,但是有时候往往不能满足我们 ...

  5. javascript创建css、js,onload触发callback兼容主流浏览器的实现

    http://www.fantxi.com/blog/archives/load-css-js-callback/ 由于需要写个函数,既可以加载css,又可以加载js,所以对各主流浏览器对加载js.c ...

  6. 3 月 15 个有意思的 JavaScript 和 CSS 库

    Tutorialzine 旨在让你了解最新最酷的 Web 发展趋势.这就是我们每个月为何都会发布一些我们偶然发现并认为值得你关注的优秀资源的原因. BasicScroll https://github ...

  7. 前端html、Javascript、CSS技术小结

    简单地总结了一下前端用过的html.javascript.css技术,算是清点一下,做个大略的小结,为进一步的学习给个纲领. 一.HTML 由于HTML5的兴起,简单地判断一个网页是否是html5网页 ...

  8. 5种JavaScript和CSS交互的方法

      分享   分享   分享   分享   分享   随着浏览器不断的升级改进,CSS和JavaScript之间的界限越来越模糊.本来它们是负责着完全不同的功能,但最终,它们都属于网页前端技术,它们需 ...

  9. JavaScript根据CSS的Media Queries来判断浏览设备的方法

    CSS 部分 首先随便新建一个用来做判断的类,然后通过 Media Queries 来对这个类的 z-index 属性赋予不同的值.这个类仅作为 JavaScript 读取使用,所以需要将其移出屏幕窗 ...

随机推荐

  1. ZOJ 3607 Lazier Salesgirl(贪心)

    题目:http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=3607 题意:一个卖面包的小姑娘,给第i个来买面包的人的价格是pi, ...

  2. 纯tarjan poj2186

    tarjan,叙叙旧咯 #include<cstdio>#define maxn 50005int e[maxn],ne[maxn],be[maxn],all;int DFN[maxn], ...

  3. bzoj4080

    分组赛时wy大神讲的题,网上都是随机化的题解 我来讲一下正解吧,我们穷举两个点,这两点距离要小于限制 然后我们分别以这两个点为圆心,两点距离为半径画圆 圆圆相交的部分被两点练成线段划分成两部分,不难发 ...

  4. Scrum&Kanban在移动开发团队的实践 (一)

    现在大多数团队都在谈敏捷开发,似乎觉得敏捷是软件开发的银弹.只需要实践下一些敏捷开发的模式就能如何如何,其实我觉得不论是敏捷开发还是传统的瀑布流开发都是有他们的市场的,取决于团队人员构成,取决你的产品 ...

  5. Java [Leetcode 257]Binary Tree Paths

    题目描述: Given a binary tree, return all root-to-leaf paths. For example, given the following binary tr ...

  6. 分析一下FastDFS_java_client中TestClient.java这个文件以及跟它关联的这条线

    本来先打算上个图来说明一下这条线的,可是我的画图工具还没有安装好,我先把跟TestClient.java相关的几个文件代码贴上来,但是由于代码行数还是不少的,所以请大家阅读文章的时候先不要展开代码,等 ...

  7. WebService 出现因 URL 意外地以“/HelloWorld”结束,请求格式无法识别。

    要在webservice的web.config文件中的 <system.web> 节点下加入: <webServices>    <protocols>       ...

  8. FZU 1591 Coral的烦恼

    Problem Description 程序设计课的老师给Coral布置了一道题:用T(n)表示所有能整除n的正整数之和,对于给定的数字n,记S(n)=T(1)+T(2)+…+ T(n).你的任务就是 ...

  9. webdriver(python) 学习笔记三

    知识点:简单的对象定位 对象的定位应该是自动化测试的核心,要想操作一个对象,首先应该识别这个对象.一个对象就是一个人一样,他会有各种的特征(属性),如比我们可以通过一个人的身份证号,姓名,或者他住在哪 ...

  10. Web自动化框架搭建之二基于数据驱动应用简单实例~~

    整体框架,先划分成细小功能模块~~,从最简单的开始,介绍 实现循环百度搜索实例: #coding=utf-8 '''Created on 2014��6��9�� @author: 小鱼'''impo ...