JS学习之动态加载script和style样式

一个月没来写文章了,最近在看C#想改写一下C#文章。不过本来文笔实在有限无法像大神那样一个个写出的博客把一个技术都写透了,连原理都写出来分享,本人菜鸟水平有限,所有就写出一点我们都比较好容易理解的来(我自己能理解的)。
前提:我们可以把一个网页里面的内容理解为一个XML或者说网页本身也就是一个XML文档,XML文档都有很特殊的象征:"标签"也叫"节点"。我们都知道一个基本的网页格式是
<!DOCTYPE />
<head></head>
<body><body />
这些是最基本的形态,但是其实它省略了最外面的一个标签<document>.
<document>
      <!DOCTYPE />
<head></head>
<body><body />
</document>
这其实才是它的本来面目(默认吧document标签给省略了)。是不是感觉有什么不一样的呢?这下子就好理解的多了。document.body 或者docment.head,无论你的什么操作只要是有关于这个<document>标签的你跟可以利用document获得,因为它是根。在看一下你所写的网页文档,记住任何存在<document>标签里面都是可以获得的,记得么 在节点类型中有document这种类型,所有的节点其实都是已经被分类好的,知识它们的nodeType和nodeName不一样而已(可以查一下资料"节点类型")。有点跑题,现在来看一下具体的代码(省略版的)如下:
 
//动态加载脚本
function loadScript(){
  var script=document.createElement("script");
  script.type="text/javascript";
  script.src=null 
try{
 script.appendChild(document.createTextNode("//code"));     //javascript内容是利用createTextNode创建的(不过IE不认这个)
}catch(ex){
script.text="//code";                                                                //IE认为SCRIPT节点是个特殊的节点所有有个特殊的text属性
}
  document.body.appendChild(script);   /*兼容IE*/
}
 
样式的:
 
// 动态记载样式
function loadStyle(){
  var style=document.createElement("style"); 
  style.type="text/css";                                                              //参考网页上的style样式,它的属性设置成什么样的这里面也设成什么样的
  style.href="style.css";
try{
   style .appendChild(document.createTextNode("//style code")); 
}catch(ex){
   style.styleSheet.styleText="//style code";    /*兼容IE*/        //IE也认为style节点是个特殊的节点所有有个特殊的styleSheet.styleText属性 - -
}
 
 var head=document.getElementByTagName("head")[0];        
  head.appchild(link);
}
 
很简单的代码清单,概述就是创建一个标签,设置一下属性,添加一下内容,放到该放的位置上。
 
   写这一份博客的时候其实在纠结这到底要不要写呢?最后我还是厚着脸皮写下去了,大神们写的博客给我压力太大了。但是又想让大家都知道我在努力,出来实习快四个月了。每天都在看书,不断的读取知识,不容易,希望有看到我这些文章的朋友们,能挺一下我,不为我写的东西,为我的努力肯定一下吧。程序员不好做,但我选择了它就不要后悔。为自己,请叫我程序员!
 
附加:有什么错误点的话,望大神们指点。批评才能知错,指点才能进步!
posted @ 2014-04-21 10:25  请叫我"程序员"  阅读(3569)  评论(1编辑  收藏  举报