博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
JavaScript高级程序设计26.pdf
阅读量:5284 次
发布时间:2019-06-14

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

DOM操作技术

 动态脚本

指得是页面加载时不存在,但将来的某一时刻通过修改DOM动态添加的脚本,跟操作HTML元素一样,创建动态脚本也有2种方式:插入外部文件和直接插入JavaScript代码

var script=document.createElement("script");

script.type="text/javascript";

script.src="client.js";

document.body.appendChild(script);

另一种指定JavaSctipt代码的方式是行内方式,由于IE将<script>视为一个特殊的元素,不允许DOM访问其子节点,不过可以使用<script>元素里的text属性指定JavaScript代码

 var script=document.createElement("script");

script.type="text/javascript";

script.text="function sayHi(){alert('Hi');}";

document.body.appendChild(script);

Safari3.0之前的版本不能正确地支持text属性,允许使用文本节点来指定代码

var script=document.createElement("script");

script.type="text/javascript";

var code="function sayHi(){alert('Hi');}";

try{

  script.appendChild(document.createTextNode(code));

  }

catch(ex){

  script.text=code;

  }

document.body.appendChild(script);

动态样式

<link>元素用于包含来自外部的文件,<style>元素用于指定嵌入的样式

function loadStyles(url){

    var link=document.createElement("link");

    link.rel="stylesheet";

    link.type="text/css";

    link.href=url;

    var head=document.getElementsByTagName("head")[0];

    head.appendChild("link");

    }

loadStyles("style.css");

IE将<style>元素视为一个特殊的、与<script>类似的节点,不允许访问其子节点,解决IE这个问题就是访问元素的styleSheet属性,该属性又有一个cssText属性,通过try-catch语句捕获IE抛出的错误,再针对IE的特殊方式设置样式

操作表格

HTML DOM为<table>、<tbody>、<tr>元素添加了一些属性和方法,方便我们操作表格

使用NodeList

理解NodeList及其“近亲”NamedNodeMap和HTMLCollection,它们都是动态的,可以

len=divs.length;避免迭代NodeList时出现问题

-------------------------------------------本章终---------------------------------------

转载于:https://www.cnblogs.com/sdgjytu/p/3754284.html

你可能感兴趣的文章
一个项目最忌讳什么
查看>>
Linq to DataSet
查看>>
SQL SERVER 強制指定使用索引 -转载 只为学习
查看>>
2015最新百度搜索引擎(seo优化)排名算法
查看>>
ADSL 拨号实现
查看>>
第2章 线程安全性-加锁机制
查看>>
摆放与布局——普通流、浮动定位、绝对定位、表格
查看>>
理解线程池中线程的复用原理
查看>>
腾讯面试题
查看>>
mysql日志配置
查看>>
面向对象总结
查看>>
超市帐单系统
查看>>
The Django Book
查看>>
2-1 Restful中HTTP协议介绍
查看>>
mysql密码过期的修改方法(your password has expired)
查看>>
Luogu2881 排名的牛Ranking the Cows
查看>>
【原创】自己动手实现RPC服务调用框架
查看>>
WC.exe-软工作业(一)
查看>>
nginx error_log报错upstream timed out (110: Connection timed out)
查看>>
mui开发app之webview
查看>>