《HTML5实战》Lesson10

Week11  2016/11/23上午1-4节

一、复习

对应的html

二、execCommand实现富文本编辑控件

1、execCommand

document.execCommand - Web API 接口

Javascript中document.execCommand()的用法 - 千里之外 - 博客频道 - CSDN.NET

JavaScript中的execCommand()命令详解及实例展示 - yiluoAK_47的专栏 - 博客频道 - CSDN.NET

2、3-7代码解析

(0)对应的html文档

(1)获取到工具条

(2)单击工具条上的button要执行的方法

1)e.target=event.target

target 事件属性可返回事件的目标节点(触发该事件的节点),如生成事件的元素、文档或窗口。

event.target.nodeName    //获取事件触发元素标签name(li,p...)

e.target与事件委托简例_JavaScript_第七城市

W3School在线测试工具 V2

2)条件运算符,语法为:条件表达式?表达式1:表达式2

说明:问号前面的位置是判断的条件,判断结果为bool型,为true时调用表达式1,为false时调用表达式2。

其逻辑为:“如果为真执行第一个,否则执行第二个。”

==, 两边值类型不同的时候,要先进行类型转换,再比较。

===,不做类型转换,类型不同的一定不等。

JavaScript 中2个等号与3个等号的区别 - - ITeye技术网站

3)dataset:获取以data-后面的字符串为属性名的属性值

HTML5自定义属性对象Dataset简介 « 张鑫旭-鑫空间-鑫生活

4)execCommand

bool= document.execCommand(aCommandName,aShowDefaultUI,aValueArgument)

返回值

一个Boolean,如果是false则表示操作不被支持或未被启用。

参数

aCommandName

一个DOMString,命令的名称。可用命令列表请参阅命令

aShowDefaultUI

一个Boolean是否展示用户界面,一般为 false。Mozilla 没有实现。

aValueArgument

一些命令需要一些额外的参数值(如insertimage需要提供这个image的url)。默认为null。

5)prompt

W3School在线测试工具 V2

prompt() 方法用于与用户交互,提示用户输入信息的对话框。

prompt(str1,str2);此方法包含两个属性;

str1:用于提示用户输入的信息。

str2:用于用户输入文本信息。

该方法返回值:返回用户输入的文本信息。

javascript 巧用prompt()函数_百度经验

(3)给工具条添加click事件

addEventListener 有三个参数:第一个参数表示事件名称(不含 on,如 "click");第二个参数表示要接收事件处理的函数;第三个参数为 useCapture:

true 的触发顺序总是在 false 之前;

如果多个均为 true,则外层的触发先于内层;

如果多个均为 false,则内层的触发先于外层。

addEventListener 的三个参数 - BryanYang - 开源中国社区

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏狮乐园

高级 Angular 组件模式 (4)

命名冲突不仅存在于指令的选择器之间,同时也会存在于指令的Inputs和Outputs属性,当这些属性名一样时,Angular并不会进行提示,它会按原本的逻辑正常...

12610
来自专栏Golang语言社区

Go并发编程基础(译)

原文:Fundamentals of concurrent programming 译者:youngsterxyf 本文是一篇并发编程方面的入门文章,以Go语言...

43980
来自专栏JackeyGao的博客

用户Python3解析超大的csv文件

我在日前获得一个任务,为了做分析, 从一个超大的csv文件中解析email地址和对应的日期时间戳然后插入到数据库中. 我知道有其他工具可以方便的完成我的工作(比...

12120
来自专栏大内老A

我所理解的Remoting(1):Marshaling & Activation[上篇]

什么是Marshaling &Activation 对任何一项分布式技术(Distributed Technology),比如Remoting,XML Web ...

19980
来自专栏GopherCoder

『Go 内置库第一季:error』

Go 中的错误处理和别的语言不一样,设计哲学也不一样,常有开发者埋怨 Go 语言中的错误处理。

12130
来自专栏农夫安全

代码审计之命令执行漏洞

环境:windows + apache + mysql + php (phpstudy) 由于是在Windows下进行的测试,所以和Linux下的测试会有所不...

29460
来自专栏逆向技术

16位汇编语言第二讲系统调用原理,以及各个寄存器详解

   16位汇编语言第二讲系统调用原理,以及各个寄存器详解 昨天已将简单的写了一下汇编代码,并且执行了第一个显示到屏幕的helloworld 问题?   hel...

24400
来自专栏极客猴

Django 学习笔记之模板

本文是自己 Django 学习笔记系列的第四篇原创文章。主要接着篇文章的视图内容,讲解模板的用法。另外也说下 Django 学习笔记系列的安排。自己计划大概 1...

5600
来自专栏自由而无用的灵魂的碎碎念

Tips in Visual Studio 2008

.NET几乎程序员都在使用visual studio 2008进行开发。可是,你通过它达到最大的开发效率了吗?

13120
来自专栏农夫安全

代码审计之命名执行漏洞

环境:windows + apache + mysql + php (phpstudy) 由于是在Windows下进行的测试,所以和Linux下的测试会有所不...

30260

扫码关注云+社区

领取腾讯云代金券