博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
JS学习之动态加载script和style样式
阅读量:6864 次
发布时间:2019-06-26

本文共 1693 字,大约阅读时间需要 5 分钟。

一个月没来写文章了,最近在看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);
}
 
很简单的代码清单,概述就是创建一个标签,设置一下属性,添加一下内容,放到该放的位置上。
 
   写这一份博客的时候其实在纠结这到底要不要写呢?最后我还是厚着脸皮写下去了,大神们写的博客给我压力太大了。但是又想让大家都知道我在努力,出来实习快四个月了。每天都在看书,不断的读取知识,不容易,希望有看到我这些文章的朋友们,能挺一下我,不为我写的东西,为我的努力肯定一下吧。程序员不好做,但我选择了它就不要后悔。为自己,请叫我程序员!
 
附加:有什么错误点的话,望大神们指点。批评才能知错,指点才能进步!

转载于:https://www.cnblogs.com/fzh312/p/3677899.html

你可能感兴趣的文章
Dubbo中基于权重的随机算法
查看>>
<问题解决10>使用带有框架的页面跳转到登录页面时,登录页面只显示在子框架中,未能铺满整个浏览器--解决方案如下:...
查看>>
oracle 锁表
查看>>
UML关系说明文档
查看>>
如何去除My97 DatePicker控件上右键弹出官网的链接 - 如何debug混淆过的代码
查看>>
dedecms织梦移站后替换数据库中文件路径命令
查看>>
openssl
查看>>
2017 WWDC
查看>>
iOS 动态更换icon
查看>>
dd命令测试IO
查看>>
Jmeter连接MySQL数据库
查看>>
HDU5446:Unknown Treasure——题解
查看>>
在C#中SendMessage和PostMessage的参数传递
查看>>
维护MMO项目的随想
查看>>
Resharper 检测所有NullReferenceExceptions(空指针)
查看>>
【java】java工具类StringUtils,org.apache.commons.lang3.StringUtils
查看>>
log4j 日志限制大小 拆分成30个 不按日期分日志 按大小拆分 按日期产生...
查看>>
使用PROJ4库将地心直角坐标(XYZ)转为地心大地坐标(BLH)
查看>>
贯穿应用开发始终的八大性能陷阱
查看>>
初创企业的初创之路
查看>>