读JS高级API笔记_(DOM&&DOM2&&DOM3)哎呀——园龄才9个月啊
---恢复内容开始---
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>DOM2 && DOM3 || HTML5DOMAPI</title>
</head>
<body>
<div>
<p>12312</p>
<ul>
<li>1</li>
<li>11</li>
<li>111</li>
<li>1111</li>
</ul>
</div>
<script>
root = document.querySelector('div');
//带命名空间的文档结构
/*
<xhtml:body xhtml:class="xx">
</xhtml:body>
*/
root.localName //不带XML空间前缀的tagName
document.doctype.publicId
//"-//W3C//DTD XHTML 1.0 Transitional//EN"
document.doctype.systemId
//"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" document.importNode; //解决不同DOM类型之间的DOM&node移动操作
document.defaultView //window 当前的window环境
//document.contentDocument /*for标准*/|| document.contentWindow.document /*for IE*/
document.styleSheets
document.scripts /* style */
style = {
cssText : '', //样式
length : '', //有几个样式
getPropertCssValue : '',
getPropertyValue : '',
"item(index)" : '', //返回第索引个的样式
removeProperty : '',
setProperty : ''
}; //HTML5元素遍历 //NodeIterator ,treeWalker
var iterator = document.createTreeWalker(root,NodeFilter.SHOW_ELEMENT,filter,false);
function filter( node ){ //有点想 ARRAY.prototype.sort方法
return node.tagName.toLowerCase() === 'li' ?
NodeFilter.FILTER_ACCEPT : //接受这个节点
NodeFilter.FILTER_SKIP //过滤掉这个节点
};
node = iterator.nextNode(); //专有方法 nextNode() 和previousNode() ,取得节点的元素
while( node != null){
console.log(node.tagName);
node = iterator.nextNode();
};
//获取range方法,
var range = document.createRange();
range.selectNode(root);
console.log( range );
//range.setStart(obj,offset)
//range.setEnd(obj,offset)
//range.extraContent;
//range.cloneContent;
//range.insertNode;
//range.surrandContent(span);
//range.collapse( true or false );
//range.compareBoundaryPoints(0 || 1 || 2 || 3,range2);
root.classList;
root.classList.contain;
root.classList.add;
root.classList.remove;
root.classList.toggle; document.activeElement; //默认body
/*
data-xx ; dataSet.xx = 1; 存数据的,实现更快访问
*/; //[
//beforebegin,
//afterbegin,
//beforeend,
//afterend
//]
root.insertAdjacentElement
root.insertAdjacentText
root.insertAdjacentHTML
root.insertAdjacentBefore //HTML5 scrollAPI
document.body.scrollIntoView() document.domain //可以实现同一个域名不同二级域名的跨域,但是只能document.domain更改一次,否则会报错
root.nodeType === '3' ? root.normalize()&&root.splitText('aaa/*这个是切割标志符*/') : ''
document.createComment('\'xxx');
var aDiv = document.getElementsByTagName('div'); //这个aDiv是根据页面自动更新的
</script>
</body>
</html>
//娃哈哈,博客园的恢复功能不错
---恢复内容结束---
读JS高级API笔记_(DOM&&DOM2&&DOM3)哎呀——园龄才9个月啊的更多相关文章
- js高级程序设计笔记之-addEventListener()与removeEventListener(),事件解除与绑定
js高级程序设计笔记之-addEventListener()与removeEventListener(),事件解除与绑定 addEventListener()与removeEventListener( ...
- 读JS高级——第五章-引用类型 _记录
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- js高级程序设计 笔记 --- DOM
DOM是针对HTML和XML文档的一个API.DOM描绘了一个层次化的节点树,允许开发人员添加.移除和修改页面的某一部分. 1,节点层次 DOM可以将任何HTML或XML文档描绘成一个由多层节点构成的 ...
- 读书笔记 - js高级程序设计 - 第十章 DOM
文档元素 是文档的最外层元素,在Html页面中,文档元素始终都是<html>元素 在xml中,任何元素都可以是文档元素 Node类型 Node.ELEMENT_NODE 元素 Node ...
- JS全部API笔记
我相信对于程序猿都有做笔记的习惯. 我初学到现在也做了不少笔记,以前,总是怕写的文章或者好的内容分享出来就怕被直接copy以后更个名就不再是你的. 但通过博客园,学习到不少东西,人家都不怕什么了,我自 ...
- js高级程序设计 笔记 --- 错误处理、json和ajax
1,错误处理 1,try-catch语句 try{可能导致错误的代码} catch(error) {在错误发生时该怎么处理} error.message是所有浏览器都支持的属性. finally语句是 ...
- js高级程序设计 笔记 --- 表单
一,基础知识 在html中,表单是form元素,而在js中,表单对应的是HTMLFormElement类型,继承自HTMLElement,其独特的属性和方法有(常见): action:接收请求的URL ...
- JS高级学习笔记(9) 之 转:前端路由跳转基本原理
原文链接: 前端路由跳转基本原理 前述 前端三大框架Angular.React和Vue都推行单页面应用SPA开发模式,这是因为在路由切换时,替换DOM Tree中发生修改的DOM部分,来减少原来因为多 ...
- JS高级学习笔记(6)- 事件循环
参考文章:深入理解JS引擎的执行机制 JavaScript 异步.栈.事件循环.任务队列 我的笔记:ES系列之Promise async 和 await Event Loop 前提 js ...
随机推荐
- 拓扑排序 codevs 4040 cojs 438
codevs 4040 EZ系列之奖金 时间限制: 1 s 空间限制: 64000 KB 题目等级 : 钻石 Diamond 题目描述 Description 由于无敌的WRN在2015年世界英 ...
- HDU 4930 Fighting the Landlords --多Trick,较复杂模拟
题意:两个人A和B在打牌,只有题目给出的几种牌能出若A第一次出牌B压不住或者A一次就把牌出完了,那么A赢,输出Yes,否则若A牌没出完而且被B压住了,那么A输,输出No. 解法:知道规则,看清题目,搞 ...
- <a href="javascript:void(0)" onclick="ff()" ></a> 用法解析
javascript:void(0) 仅仅表示一个死链接 如果是个# javascript:void(#),就会出现跳到顶部的情况,搜集了一下解决方法 1:<a href="####& ...
- QTP学习一添加默认的注释及调用外部vbs文件
一.添加默认注释 1.新建一个TXT文档,将要添加的注释写在文档中 2.再将文档名改为:ActionTemplate.mst 3.将文件放到QTP安装目录(默认为:C:\Program Files\H ...
- Jedis下的ShardedJedis(分布式)使用方法(二)
上一篇中介绍了ShardedJedis的基本使用方法以及演示了一个简单的例子,在这一篇中我们来介绍了ShardedJedis的原理. 1.ShardedJedis内部实现 首先我们来看一下Sharde ...
- java 20 -10 字节流四种方式复制mp3文件,测试效率
电脑太渣,好慢..反正速率是: 高效字节流一次读写一个字节数组 > 基本字节流一次读写一个字节数组 > 高效字节流一次读写一个字节 > 基本字节流一次读写一个字节 前两个远远快过后面 ...
- NSDictionary(key与value)
1.key与value关系,用一个key的值控制整个模型 NSDictionary *dic = @{@"channelKey":channelModel,@"chann ...
- ILMerge 简单应用
ILMerge是合并.net的assembly的工具,最新版的支持.net 4.0的ILmerge下载: http://www.microsoft.com/downloads/details.aspx ...
- MSMQ消息队列安装
一.Windows 7安装.管理消息队列1.安装消息队列 执行用户必须要有本地 Administrators 组中的成员身份,或等效身份. 具体步骤: 开始—>控制面板—>程 ...
- MVC中利用自定义的ModelBinder过滤关键字
上一篇主要讲解了如何利用ActionFilter过滤关键字,这篇主要讲解如何利用自己打造的ModelBinder来过滤关键字. 首先,我们还是利用上一篇中的实体类,但是我们需要加上DataType特性 ...