08 2017 档案

摘要:因为JavaScript在浏览器中以单线程模式运行,页面加载后,一旦页面上所有的JavaScript代码被执行完后,就只能依赖触发事件来执行JavaScript代码。 浏览器在接收到用户的鼠标或键盘输入后,会自动在对应的DOM节点上触发相应的事件。如果该节点已经绑定了对应的JavaScript处理函 阅读全文
posted @ 2017-08-22 12:02 ocean_boy 阅读(178) 评论(0) 推荐(0) 编辑
摘要:直接使用浏览器提供的API对DOM结构进行修改,不但代码复杂,而且要针对浏览器写不同的代码。 有了jQuery,我们就专注于操作jQuery对象本身,底层的DOM操作由jQuery完成就可以了,这样一来,修改DOM也大大简化了。 添加DOM 要添加新的DOM节点,除了通过jQuery的html()这 阅读全文
posted @ 2017-08-22 11:17 ocean_boy 阅读(382) 评论(0) 推荐(0) 编辑
摘要:jQuery的选择器很强大,用起来又简单又灵活,但是搞了这么久,我拿到了jQuery对象,到底要干什么? 答案当然是操作对应的DOM节点啦! 回顾一下修改DOM的CSS、文本、设置HTML有多么麻烦,而且有的浏览器只有innerHTML,有的浏览器支持innerText,有了jQuery对象,不需要 阅读全文
posted @ 2017-08-22 10:10 ocean_boy 阅读(152) 评论(0) 推荐(0) 编辑
摘要:通常情况下选择器可以直接定位到我们想要的元素,但是,当我们拿到一个jQuery对象后,还可以以这个对象为基准,进行查找和过滤。 最常见的查找是在某个节点的所有子节点中查找,使用find()方法,它本身又接收一个任意的选择器。例如如下的HTML结构: 用find()查找: 截图: 如果要从当前节点开始 阅读全文
posted @ 2017-08-22 09:55 ocean_boy 阅读(1935) 评论(0) 推荐(0) 编辑
摘要:层级选择器(Descendant Selector) 如果两个DOM元素具有层级关系,就可以用$('ancestor descendant')来选择,层级之间用空格隔开。例如: 要选出JavaScript,可以用层级选择器: 因为<div>和<ul>都是<li>的祖先节点,所以上面两种方式都可以选出 阅读全文
posted @ 2017-08-22 09:25 ocean_boy 阅读(522) 评论(0) 推荐(0) 编辑
摘要:选择器是jQuery的核心。一个选择器写出来类似$('#dom-id')。 为什么jQuery要发明选择器?回顾一下DOM操作中我们经常使用的代码: 这些代码实在太繁琐了,并且,在层级关系中,例如,查找<table class="green">里面的所有<tr>,一层循环实际上是错的,因为<tabl 阅读全文
posted @ 2017-08-21 15:58 ocean_boy 阅读(148) 评论(0) 推荐(0) 编辑
摘要:你可能听说过jQuery,它名字起得很土,但却是JavaScript世界中使用最广泛的一个库。 江湖传言,全世界大约有80~90%的网站直接或间接地使用了jQuery。鉴于它如此流行,又如此好用,所以每一个入门JavaScript的前端工程师都应该了解和学习它。 jQuery这么流行,肯定是因为它解 阅读全文
posted @ 2017-08-21 15:16 ocean_boy 阅读(134) 评论(0) 推荐(0) 编辑
摘要:javascript的迭代器以及面向对象 javascript文件操作 promise 阅读全文
posted @ 2017-08-21 15:04 ocean_boy 阅读(85) 评论(0) 推荐(0) 编辑
摘要:Canvas是HTML5新增的组件,它就像一块幕布,可以用JavaScript在上面绘制各种图表、动画等。 没有Canvas的年代,绘图只能借助Flash插件实现,页面不得不用JavaScript和Flash进行交互。有了Canvas,我们就再也不需要Flash了,直接使用JavaScript完成绘 阅读全文
posted @ 2017-08-21 11:53 ocean_boy 阅读(154) 评论(0) 推荐(0) 编辑
摘要:在JavaScript的世界中,所有代码都是单线程执行的。 由于这个“缺陷”,导致JavaScript的所有网络操作,浏览器事件,都必须是异步执行。异步执行可以用回调函数实现: 结果: 你会发现Done是在前俩个输出之后隔了3秒才输出的噢,这样就用函数实现了异步机制,不会阻塞后面的执行语句。 可见, 阅读全文
posted @ 2017-08-21 10:58 ocean_boy 阅读(135) 评论(0) 推荐(0) 编辑
摘要:AJAX 阅读: 122318 AJAX不是JavaScript的规范,它只是一个哥们“发明”的缩写:Asynchronous JavaScript and XML,意思就是用JavaScript执行异步网络请求。 如果仔细观察一个Form的提交,你就会发现,一旦用户点击“Submit”按钮,表单开 阅读全文
posted @ 2017-08-21 10:47 ocean_boy 阅读(120) 评论(0) 推荐(0) 编辑
摘要:在HTML表单中,可以上传文件的唯一控件就是<input type="file">。 注意:当一个表单中包含<input type="file">时,表单的enctype必须指定 为multipart/form-data,method必须指定为post,浏览器才能正确并以multipart/form 阅读全文
posted @ 2017-08-18 13:44 ocean_boy 阅读(690) 评论(0) 推荐(0) 编辑
摘要:用JavaScript操作表单和操作DOM是类似的,因为表单本身也是DOM树。 不过表单的输入框、下拉框等可以接收用户输入,所以用JavaScript来操作表单,可以获得用户输入的内容,或者对一个输入框设置新的内容。 HTML表单的输入控件主要有以下几种: 文本框,对应的<input type="t 阅读全文
posted @ 2017-08-17 17:19 ocean_boy 阅读(211) 评论(0) 推荐(0) 编辑
摘要:删除一个DOM节点就比插入要容易得多。 要删除一个节点,首先要获得该节点本身以及它的父节点,然后调用父节点的removechild把自己删掉即可: 结果: 删除的节点虽然不在文档树中了,但其实它还是在内存中保留的,可以随时再次被添加到别的位置 结果: 当我们遍历一个父节点的子节点并进行删除操作时,要 阅读全文
posted @ 2017-08-17 16:37 ocean_boy 阅读(3604) 评论(0) 推荐(0) 编辑
摘要:当我们获得了某个DOM节点,想在这个DOM节点内插入新的DOM,应该如何做? 如果这个DOM节点是空的,例如,<div></div>,那么,直接使用innerHTML = '<span>child</span>'就可以修改DOM节点的内容,相当于“插入”了新的DOM节点。 如果这个DOM节点不是空的 阅读全文
posted @ 2017-08-16 17:36 ocean_boy 阅读(2462) 评论(0) 推荐(0) 编辑
摘要:拿到一个DOM节点后,我们可以对它进行更新。 可以直接修改节点的文本,方法有两种: 一种是修改innerHTML属性,这个方式非常强大,不但可以修改一个DOM节点的文本内容,还可以直接通过HTML片段修改DOM节点内部的子树: 用innerHTML时要注意,是否需要写入HTML。如果写入的字符串是通 阅读全文
posted @ 2017-08-16 16:56 ocean_boy 阅读(3954) 评论(0) 推荐(0) 编辑
摘要:由于HTML文档被浏览器解析后就是一棵DOM树,要改变HTML的结构,就需要通过JavaScript来操作DOM。 始终记住DOM是一个树形结构。操作一个DOM节点实际上就是这么几个操作: 更新:更新该DOM节点的内容,相当于更新了该DOM节点表示的HTML的内容; 遍历:遍历该DOM节点下的子节点 阅读全文
posted @ 2017-08-16 16:41 ocean_boy 阅读(309) 评论(0) 推荐(0) 编辑
摘要:JavaScript可以获取浏览器提供的很多对象,并进行操作。 window window对象不但充当全局作用域,而且表示浏览器窗口。 window对象有innerWidth和innerHeight属性,可以获取浏览器窗口的内部宽度和高度。内部宽高是指除去菜单栏、工具栏、边框等占位元素后,用于显示网 阅读全文
posted @ 2017-08-16 16:40 ocean_boy 阅读(346) 评论(0) 推荐(0) 编辑
摘要:由于JavaScript的出现就是为了能在浏览器中运行,所以,浏览器自然是JavaScript开发者必须要关注的。 目前主流的浏览器分这么几种: IE 6~11:国内用得最多的IE浏览器,历来对W3C标准支持差。从IE10开始支持ES6标准; Chrome:Google出品的基于Webkit内核浏览 阅读全文
posted @ 2017-08-16 16:32 ocean_boy 阅读(269) 评论(0) 推荐(0) 编辑
摘要:JavaScript对每个创建的对象都会设置一个原型,指向它的原型对象。 当我们用obj.xxx访问一个对象的属性时,JavaScript引擎先在当前对象上查找该属性,如果没有找到,就到其原型对象上找,如果还没有找到,就一直上溯到Object.prototype对象,最后,如果还没有找到,就只能返回 阅读全文
posted @ 2017-08-16 15:25 ocean_boy 阅读(177) 评论(0) 推荐(0) 编辑
摘要:JavaScript的所有数据都可以看成对象,那是不是我们已经在使用面向对象编程了呢? 当然不是。如果我们只使用Number、Array、string以及基本的{...}定义的对象,还无法发挥出面向对象编程的威力。 JavaScript的面向对象编程和大多数其他语言如Java、C#的面向对象编程都不 阅读全文
posted @ 2017-08-16 14:01 ocean_boy 阅读(144) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示