在网页开发中如果不想自己写或者引入其他第三方 对话框,则浏览器中调用的系统对话框就会极大提高我们的 demo 效率; 浏览器中可以调用的系统对话框有: alert(message), prompt(message,defaultValue), confirm(message),print
我们可以在 vsCode 中查看 lib.dom.d.ts 这些对话框调用的 函数声明为:
alert(message?: any): void;confirm(message?: string): boolean;prompt(message?: string, _default?: string): string | null;print(): void;
注意
这些对话框与浏览器中显示的网页无关,而且也不包含 HTML,他们只是可以让浏览器调用显示对应的系统对话框为用户显示对应的信息等操作,因此他们的外观由操作系统或者浏览器决定,无法使用 CSS 设置,且这些对话框都是同步的模态对话框,他们显示的时候,代码就会停止执行,消失之后代码才会恢复执行。
使用方法
正如 lib.dom.d.ts 文件中声明的那样,我们可以极速的知道他们的使用方法,因此只做简单的说明即可,相信你懂的,他们声明在 window interface 中,因此直接使用 window 调用对应的方法。
alert(message)
alert 接受的 message 是任意类型的,通常 alert 是向用户展示用户无法控制的信息,因此它就是一个警告框,只有一个 “OK” 按钮, message 显示的时候会调用toString() 方法
confirm(message)
confirm 接受一个字符串类型的 message, 显示的对话框 有 “确定” 和 “取消”按钮,点击 “确定” 时返回 true, 反之为 false
prompt(message,defaultValue)
prompt 是一个用户用户可输入信息的对话框,会显示一个文本框供用户输入,输入后的值将会在用户点击“确定”按钮后返回文本框里的值, 反之返回 null 值
print()
print 方法会调用 系统的 打印 功能, 该功能可以很快的打印出你想打印的网页内容,是不是很棒!
还有一个方法 window.find(), 这个方法会发现网页中 是否有对应的文字,但是这个方法将 不是标准的,他不是对每个用户都管用,因此就不建议使用他了,如果你想看请 戳 MDN window.find()
谢谢你的阅读,如有错误,欢迎指正
原文:https://juejin.cn/post/7099224158436851719