《JavaScript》——DOM】的更多相关文章

DOM (Document Object Model) 即文档对象模型, 针对 HTML 和 XML 文档的 API (应用程序接口) .DOM 描绘了一个层次化的节点树,执行开发者加入.移除和改动页面的某一部分. DOM中提供了两个节点接口,一个Node接口,一个是document接口,这两种接口的属性和方法基本包括了对节点树的全部操作. 那什么是节点树那? 节点树:载入 HTML 页面时, Web 浏览器生成一个树型结构, 用来表示页面内部结构. DOM 将这样的树型结构理解为由节点组成.…
构造函数 var arr1 = new Array();// [] 空数组 var arr2 = new Array(3);//定义长度,0是空数组 var arr3 = new Array(1,2,'nihao');//实例化 直接量语法 var arr1 = [];//空的 var arr2 = [1,'nihoa']; 属性 length array.length //数组长度,拥有几个元素 Array.length //1,空数组的长度都为1 方法 是否有返回值 函数本身是否有改变 co…
语言标准版本名字:ECMAScript(ECMA是欧洲计算机制造协会,据说可能是专门做标准的,除了JavaScript遵循这个标准以外,还有XX....)    Jscript(IE对该语言实现版本的描述) ECMA: 1996.11 ES1.0:Netscape将JS提交到ECMA组织 1998.06 ES3.0(ECMAScript3):所有web浏览器都实现.标志着 ECMAScript 成为一种真正的编程语言. 2007.07 ES4.0:挂了,没有发行过正式版 2008.07 ES3.…
Web存储: 兼容IE8在内的所有主流浏览器,不兼容早期浏览器:支持大容量但非无限量 LocalStorage和sessionStorage是window对象的两个属性,这两个属性都代表同一个storage(持久化关联数组)对象 两者的区别在于:存储的有效期和作用域不同 Storage: localStorage: var name = localStorage.username; //查询一个存储的值 //关联数组,和对象一样 //索引数组,用下标 //name = localStorage[…
一.创建XMLHttpRequest对象 二.XHR的用法 五.跨域资源共享 六.其他跨域技术七.安全七.安全 1. 图像Ping 2. JSONP(JSON with padding,填充式JSON/参数式JSON) 3. Comet(“服务器推送”) 4. 服务器发送事件(SSE:Server-Sent Events) 5. Web Sockets 6. SSE & Web Sockets 7. 跨域方法小结: 七.安全 Ajax的技术核心是XMLHttpRequest对象(简称XHR) 一…
JS脚本语言: 这是JaxaScript的全称名 JS是网页里面使用的脚本语言 JS是一个非常强大的语言 JS的基础语法 注释语法:  单行注释 //     多行注释 /**/ 输出语法:   双标签公式:<script>公式内容</script> alert("信息")        公式内容} 此代码是在页面上弹出信息 confirm(”信息“);     公式内容}        此代码会弹出一个和用户交互的对话框. 有{确定}{取消} prompt(&…
1.jquery中用attr()方法来获取和设置元素属性,attr是attribute(属性)的缩写,在jQuery DOM操作中会经常用到attr(),attr()有4个表达式. attr(属性名)        //获取属性的值(取得第一个匹配元素的属性值.通过这个方法可以方便地从第一个匹配元素中获取一个属性的值.如果元素没有相应属性,则返回 undefined attr(属性名, 属性值)   //设置属性的值 (为所有匹配的元素设置一个属性值.) attr(属性名,函数值)     //…
容易发生类型转换错误的另一个地方,就是流控制语句.像if之类的语句在确定下一步操作之前,会自动把任何值转换成布尔值.尤其是if语句,如果使用不当,最容易出错.来看下面的例子. function concat(str1,str2,str3){ var result= str1 + str2; if (str3){ //绝对不要这样 result += str3; } return result; } 这个函数的用意是拼接两或三个字符串,然后返回结果.其中,第三个字符串是可选的,因此必须要检查.第3…
7.2 闭包 定义: 闭包是指有权访问另一个函数作用域中的变量的函数. 理解闭包: 作用域链: 当某个函数被调用时,会创建一个执行环境以及相应的作用域链. 作用域链中,外部函数的活动对象始终处于第二位,外部函数的外部函数的活动对象处于第三位.....直至作为作用域链终点的全局执行环境 变量对象: 全局函数的变量对象始终存在, 而局部环境的变量对象只在函数执行的过程中存在. 一般来讲, 当函数执行完毕后, 局部活动对象就会被销毁, 内存中仅保存全局作用域(全局执行环境中的变量对象)但是闭包的情况又…
escape/unescape encodeURIComponent/decodeURIComponent encodeURI/decodeURI 转义函数会对一些 特殊字符进行转义编码 英文.数字.保留字(特殊字符)不会被转义 https://www.cnblogs.com/shuiyi/p/5277233.html…
js中的forEach()方法只能遍历数组,不能遍历字符串和对象,和$.each()有很多使用上的区别array.forEach(funcion(value,index,arr){},thisValue);value必须:index:元素下标(可选):arr:调用方法的数组thisValue,forEach中,this指代的值 //去除数组中相同的元素 function unique(array){ var arr = [] array.forEach(function(val,key,arrs…
首先了解split和join两个函数 split 根据条件截断字符串,返回数组 //str.split(option,length) 字符串转数组 //option:表示分割依据 //length:用来分割的字符串长度,只有在option为''时生效 var str = 'AB CD' str.split() //["AB CD"] 字符串为一个数组元素 str.split('') //["A", "B", " ", &quo…
function foo(a,b){return a+b}//函数申明 var foo=function(){}//函数表达式赋值 var foo=new Function('a','b','return a+b');//构造函数,最后一个参数被看做是函数体动态创建函数 call.apply function foo(c, d) { console.log(this.a + '+' + this.b + '+' + c + '+' + d) } var obj = { a: 1, b: 2 }…
参考博客:https://www.cnblogs.com/yongshaoye/p/7423881.html…
window.location.href: <i onclick="window.location.href = '/Form/Form_Write/Index?viewname=Form_Write'"></i>…
题外话 最近在看<JavaScript高级程序设计>这本书,面对着700多页的厚书籍,心里有点压力,所以我决定梳理一下..探究一下到底怎么读这本书.本书的内容好像只有到ES5...所以只能以后慢慢加了... 这一系列围绕 这一系列文章主要围绕: 如何阅读<JavaScript...> 全书的脉络是什么? 预备知识:像我这种小白,有时真的看的是一脸糊涂. 还没想好,,, 全书的划分 在看书之前,先大体看一下目录,将全书划分一下,对每一个有大体的了解.可分为: (1-2章) :可以通俗…
题外话 最近在看<JavaScript高级程序设计>这本书,面对着700多页的厚书籍,心里有点压力,所以我决定梳理一下..探究一下到底怎么读这本书.本书的内容好像只有到ES5...所以只能以后慢慢加了... 这一系列围绕 这一系列文章主要围绕: 如何阅读<JavaScript...> 全书的脉络是什么? 预备知识:像我这种小白,有时真的看的是一脸糊涂. 还没想好,,, 全书的划分 在看书之前,先大体看一下目录,将全书划分一下,对每一个有大体的了解.可分为: (1-2章) :可以通俗…
之前我们讲过JavaScript之DOM对象获取的两篇文章,本文是该系列文章之三,点击回顾上两篇文章能更好地理解本文.<JavaScript之DOM对象的获取(一)>: <JavaScript之DOM对象的获取(二)> 接下来,开始讲述本文内容.在文档中,我们还可以通过不同的现象和特征获取DOM对象. 8.document.activeElement 这是一个属性,返回当前获取焦点的元素  效果 9.document.anchors 返回对文档中所有Anchor对象的引用,即获取当…
我们在操作html中的节点的时候,第一步就需要获取到对应节点(元素),才能有后续的操作.获取节点的方式有很多 1.document.getElementById(‘id值’) 通过id精确的选中某一个节点 说明通过document对象,根据id获取某个精确的节点对象(获取id值为mydiv1的节点) 2.document.getElementsByName(‘name属性值’) 通过name属性值获取一组元素对象 说明通过document对象,根据name属性获取一组节点对象(获取name属性值…
<高性能javascript> 领悟随笔之-------DOM编程篇二 序:在javaSctipt中,ECMASCRIPT规定了它的语法,BOM实现了页面与浏览器的交互,而DOM则承载着整个页面文档.DOM编程性能一直以来都是非常受开发者关注的话题,如何编写高性能的DOM是前端开发必不可少的技能. 1.重绘与重排 当浏览器加载完页面所有的元素.js.css.图片之后会自动生成两个数据结构: 1.dom树 (图片为转载) 如图所示,dom树表示了整个页面文档的结构,通过访问dom树我们可以得到某…
<高性能javascript> 领悟随笔之-------DOM编程篇一 序:在javaSctipt中,ECMASCRIPT规定了它的语法,BOM实现了页面与浏览器的交互,而DOM则承载着整个页面文档.DOM编程性能一直以来都是非常受开发者关注的话题,如何编写高性能的DOM是前端开发必不可少的技能. 1.DOM访问与修改 访问DOM元素是有一定的性能代价的,有时候这种代价会整体拖慢网页的运行速度,例如循环访问或修改一些元素内容,操作不当会导致页面卡帧,甚至是假死,例如下面的代码. functio…
第一章<JavaScript简史> 1.JavaScript是一种脚本语言,通常只能通过Web浏览器去完成一些操作而不能像普通意义上的程序那样独立运行,它需要由Web浏览器进行解释和执行. 2.DOM是一套对文档的内容进行抽象和概念化的方法,它是一种API(应用编程接口). W3C对DOM的定义是:一个与系统平台和编程语言无关的接口,程序和脚本可以通过这个接口动态地访问和修改文档的内容.结构和样式. 第二章<JavaScript语法> 1.驼峰格式(camel case)命名:删除…
DOM(文档对象模型)是针对HTML和XML文档的一个API(应用程序编程接口).DOM描绘了一个层次节点树,允许开发人员添加.移除和修改. 1.节点层次 <html> <head> <title>Simple Page</title> </head> <body> <p>Hello World!</p> </body> </html> 如上的HTML文档,可以表示为一个层次结构. 文档…
阅读了本书第五章关于使用JavaScript的最佳实践,大部分的建议之前都有耳闻,不过阅读之后有更深的体会. 1.防止滥用JavaScript “不管你想通过JavaScript改变哪个网页的行为,都必须三思而后行.首先要确认:为这个网页增加这种额外的行为是否确有必要?” 个人认为,作者的这句话放在当前几乎无处不用JavaScript来增强Web页面交互体验的时代,可以理解为应该适当的使用JavaScript,而不要因为使用了实现酷炫效果的脚本导致网页加载缓慢或者兼容性极差而舍本求末,导致用户无…
在<JavaScript dom 编程艺术>第11章学来的. 相对于用JavaScript替换文本框的提示语句 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script> window.onload = function() { //需要判断…
刚刚开始自学前端,如果不对请指正:欢迎各位技术大牛指点. 开始学习<javascript dom编程艺术>,整理一下学习到的知识.今天刚刚看到第六章,记下get到的几个知识点. 优雅降级 看到版本翻译为预留退路,刚刚看到个名词,我觉得很奇怪,以前没有听说过啊.不过看到英文注释就知道了Graceful degradation不就是优雅降级么,听说过! 书中举了个例子,点击一个链接,弹出一个窗口的方法. function popUp(WinURL){ window.open(WinURL,&quo…
前几天京东买了一本书,在豆瓣上好评如潮,买下了啃一啃,书名<JavaScript DOM 编程艺术>,在好好深造一下javaScript.一边啃,一边敲.当然应该要做好笔记.一些简单的就看看就的了. JavaScript 语句 DOM…
我的前端入门第一本书是<JavaScript Dom 编程艺术>,网上查找资料发现前端的入门推荐书籍最受好评的就是这本和<JavaScript 高级程序设计>了.之所以先选这本是因为这本书从实例开始带领读者一步步学习,写作风格也如其名字一样具有艺术感,阅读起来很舒服.本书第一二三稍微有计算机基础的人阅读起来都不困难,也没有什么好记录的,从第四章开始,本书开始介绍案例图片库~每一节都是干货满满滴~ 第四章——案例研究:JavaScript图片库: 4.1 标记 无序清单元素<u…
目录 <JavaScript DOM 编程艺术> 学习笔记 第一章 js简史 第二章 js语法 准备工作 语法 第三章 DOM DOM中的D DOM中的O DOM中的M 第四章 js图片库 第五章 最佳实践 平稳退化 渐进增强 向后兼容 分离js 性能考虑 第六章 案例:图片库改进 第七章 动态创建标记 传统方法 DOM方法 Ajax 第八章 充实文档内容 <JavaScript DOM 编程艺术> 学习笔记 概念: 平稳退化 渐进增强 以用户为中心 第一章 js简史 可以使用DO…
最近在研读一本书<JavaScript设计模式与开发实践>,进阶用的. 一.高阶函数 高阶函数是指至少满足下列条件之一的函数. 1. 函数可以作为参数被传递. 2. 函数可以作为返回值输出. 1)高阶函数实现AOP AOP(面向切面编程)的主要作用是把一些跟核心业务逻辑模块无关的功能抽离出来,这些跟业务逻辑无关的功能通常包括日志统计.安全控制.异常处理等. 把这些功能抽离出来之后,再通过“动态织入”的方式掺入业务逻辑模块中. 这样做的好处首先是可以保持业务逻辑模块的纯净和高内聚性,其次是可以很…