泉州最专业微信网站建设公司,检察院门户网站建设情况总结,贵阳查房子备案的网站,建设银行网站查询房贷信息✨前言✨ 本篇文章主要在于#xff0c;让我们看几个与用户交互的函数#xff1a;alert#xff0c;prompt 和confirm的使用及区别 #x1f352;欢迎点赞 #x1f44d; 收藏 ⭐留言评论 #x1f4dd;私信必回哟#x1f601; #x1f352;博主将持续更新学习记录收获让我们看几个与用户交互的函数alertprompt 和confirm的使用及区别 欢迎点赞 收藏 ⭐留言评论 私信必回哟 博主将持续更新学习记录收获友友们有任何问题可以在评论区留言 文章目录 一alert二prompt三confirm四总结 一alert
alert函数接受一个字符串作为参数这个字符串将作为消息显示在警告框中。
例如
alert(Hello);弹出的这个带有信息的小窗口被称为 模态窗。 “modal” 意味着用户不能与页面的其他部分例如点击其他按钮等进行交互直到他们处理完窗口。在上面示例这种情况下 —— 直到用户点击“确定”按钮。 二prompt
prompt 函数接收两个参数
result prompt(title, [default]);浏览器会显示一个带有文本消息的模态窗口还有 input 框和确定/取消按钮。
title显示给用户的文本default可选的第二个参数指定 input 框的初始值。
语法中的方括号 […]
上述语法中 default 周围的方括号表示该参数是可选的不是必需的。
访问者可以在提示输入栏中输入一些内容然后按“确定”键。然后我们在 result 中获取该文本。或者他们可以按取消键或按 Esc 键取消输入然后我们得到 null 作为 result。
prompt 将返回用户在 input 框内输入的文本如果用户取消了输入则返回 null。
举个例子
let age prompt(How old are you?, 100);alert(You are ${age} years old!); // You are 100 years old!IE 浏览器会提供默认值
第二个参数是可选的。但是如果我们不提供的话Internet Explorer 会把 “undefined” 插入到 prompt。
我们可以在 Internet Explorer 中运行下面这行代码来看看效果
let test prompt(Test);所以为了 prompt 在 IE 中有好的效果我们建议始终提供第二个参数
let test prompt(Test, ); // -- 用于 IE 浏览器三confirm
语法
result confirm(question);confirm 函数显示一个带有 question 以及确定和取消两个按钮的模态窗口。
点击确定返回 true点击取消返回 false。
例如
let isBoss confirm(Are you the boss?);alert( isBoss ); // 如果“确定”按钮被按下则显示 true四总结
我们学习了与用户交互的 3 个浏览器的特定函数
alert显示信息。prompt显示信息要求用户输入文本。点击确定返回文本点击取消或按下 Esc 键返回 null。confirm显示信息等待用户点击确定或取消。点击确定返回 true点击取消或按下 Esc 键返回 false。
这些方法都是模态的它们暂停脚本的执行并且不允许用户与该页面的其余部分进行交互直到窗口被解除。
上述所有方法共有两个限制
模态窗口的确切位置由浏览器决定。通常在页面中心。窗口的确切外观也取决于浏览器。我们不能修改它。
这就是简单的代价。还有其他一些方法可以显示更漂亮的窗口并与用户进行更丰富的交互但如果“花里胡哨”不是非常重要那使用本节讲的这些方法也挺好。 任务
创建一个简单的页面
重要程度: 4
创建一个要求用户输入 name并通过浏览器窗口对键入的内容进行输出的 web 页面。
解决方案
JavaScript 代码
let name prompt(What is your name?, );
alert(name);整个页面的代码
!DOCTYPE html
html
bodyscriptuse strict;let name prompt(What is your name?, );alert(name);/script/body
/html✨最后✨ 总结不易希望uu们不要吝啬你们的哟()ノ~ 如有问题欢迎评论区批评指正
