JavaScript中alert、confrim、prompt的使用及区别【精选】

Hi i,m JinXiang

---

⭐ 前言 ⭐

本篇文章主要介绍JavaScript中alert、confrim、prompt的区别及使用以及部分理论知识

---

欢迎点赞 收藏 ⭐留言评论 私信必回哟

博主收将持续更新学习记录获，友友们有任何问题可以在评论区留言

---

目录

⭐一、alert

1、什么是alert？

2、使用alert

alert的定义和用法

alert的语法

alert的代码示例

3、总结alert

⭐二、confrim

1、什么是confrim？

2、使用confrim

confrim的定义和用法

confrim的语法

confrim的代码示例

3、总结confrim

⭐三、prompt

1、什么是prompt？

2、使用prompt

prompt的定义和用法

prompt的语法

prompt的代码示例

3、总结prompt

⭐alert、confrim和prompt的区别

---

⭐一、alert

1、什么是alert？

在JavaScript中，alert是一个内置函数，用于显示一个警告框，向用户显示一条消息。它是一种简单的弹出窗口，常用于给用户提供提示或警告信息。

alert函数接受一个字符串作为参数，这个字符串将作为消息显示在警告框中。例如：

alert("Hello, World!");

以上代码将在网页上弹出一个警告框，其中显示的消息是"Hello, World!"。用户需要点击"确定"按钮才能关闭警告框。

alert函数在JavaScript开发中的使用相对较少，因为它会阻塞代码执行，直到用户关闭警告框。通常，开发者更倾向于使用其他更灵活的方式来与用户进行交互，比如使用模态框或自定义弹窗组件。

2、使用alert

alert的定义和用法：alert() 方法用于显示带有一条指定消息和一个 确认 按钮的警告框。

alert的语法：alert(message)

使用alert函数的基本语法如下：

alert("你好，我是一个警告框！");

提示框一般用于在网页中向用户显示一些提示或警告信息。例如，在表单验证时，如果用户输入的内容不符合要求，可以使用alert函数弹出一个提示框，告知用户输入有误。

alert的代码示例：显示一个按钮 弹出警告框

alert是JavaScript中的一个内置函数，用于在网页上显示简单的警告框。它的使用方法是调用alert函数并传入要显示的消息作为参数。警告框会以模态的形式弹出并显示指定的消息，用户需要点击确定按钮才能关闭警告框。

3、总结alert

在使用alert函数时，需要注意以下几点：

1. alert函数会阻塞代码执行：当alert函数被调用时，代码的执行会暂停，直到用户点击提示框上的确定按钮。这意味着，在用户关闭提示框之前，代码不会继续执行。

2. 提示框的样式和外观不可自定义：alert函数生成的提示框的样式和外观是由浏览器决定的，无法通过代码进行定制。不同浏览器可能有不同的提示框样式，且不支持自定义添加样式或图标。

3. 提示框中只能显示文本信息：alert函数只能展示纯文本信息，不支持在提示框中添加HTML或其他富文本格式。如果需要展示复杂的内容，可以考虑使用其他方式，如弹出自定义模态窗口。

4. 不支持用户输入或反馈：alert函数只能用于向用户展示信息，无法获取用户的输入或反馈。用户无法在提示框中输入任何内容或进行选择操作，只能通过点击确定按钮关闭提示框。

5. 警惕滥用alert函数：过多使用alert函数可能会影响用户体验，因为频繁的提示框会打断用户的工作流程。应该适度使用alert函数，只在必要的情况下向用户展示重要的信息或警告。

需要注意的是，alert函数没有返回值，所以不能将alert函数的执行结果赋给一个变量或进行其他操作。它只是单纯地用于展示提示信息。

⭐二、confrim

1、什么是confrim？

confirm是JavaScript中的一个内置函数，用于在网页上显示一个确认框。与alert不同的是，confirm会显示一个包含确定和取消按钮的对话框，用于询问用户是否执行某个操作。

使用confirm函数时，需要传入一个字符串作为参数，作为对话框中显示的消息。当用户点击确定按钮时，confirm函数会返回true，表示用户确认执行操作；当用户点击取消按钮时，confirm函数会返回false，表示用户取消了操作。

var result = confirm("确认要删除该数据吗?");
if (result) {
    // 执行删除操作
} else {
    // 取消删除操作
}

confirm函数通常用于需要用户确认的重要操作，例如删除数据、提交表单等。通过询问用户是否确认执行操作，可以预防用户误操作或不正确的操作。

需要注意的是，confirm函数是阻塞的，即在用户作出选择之前，页面中的其他操作会被暂停。因此，在使用confirm函数时，应谨慎考虑对用户体验的影响，并在必要时使用其他异步的交互方式来代替。

2、使用confrim

confrim的定义和用法：confirm()方法用于显示一个带有指定消息和确认及取消按钮的对话框。

confrim的语法：confirm(message)

使用confirm函数的基本语法如下：

var result = confirm("确认要执行操作吗?");

在确认框中，会显示一个包含确认和取消按钮的对话框，并显示传入的消息字符串。用户点击确认按钮时，confirm函数会返回true，表示用户确认执行操作；用户点击取消按钮时，confirm函数会返回false，表示用户取消了操作。

confrim的代码示例：显示一个确认框，提醒访客点击什么：

function myFunction(){
    var x;
    var r=confirm("按下按钮!");
    if (r==true){
        //执行操作
        x="你按下了\"确定\"按钮!";
    }
    else{
        //取消操作
        x="你按下了\"取消\"按钮!";
    }
    document.getElementById("demo").innerHTML=x;
}

在上述示例中，如果用户确认要按下按钮，则执行“按下了确定按钮”的动作；如果用户取消了按下按钮操作，则执行“按下了取消按钮”的动作。 

需要注意的是，confirm函数返回的是一个布尔值，可以直接在if语句中使用。如果用户关闭了对话框而没有点击确认或取消按钮，则confirm函数将返回undefined。因此，在使用confirm函数时，最好在if语句中添加一个判断条件来处理这种情况。

3、总结confrim

confirm是JavaScript中一种常用的交互函数，用于显示一个确认对话框并获取用户的确认或取消操作。其基本语法为confirm(message)，其中message是一个字符串参数，用于显示在确认对话框中的消息。

使用confirm函数时，会显示一个带有确认和取消按钮的对话框，用户可以点击其中一个按钮来确定或取消操作。当用户点击确认按钮时，confirm函数返回true，表示确认操作；当用户点击取消按钮时，confirm函数返回false，表示取消操作。

我们可以根据confirm函数的返回值来进行相应的操作。常见的用法是将confirm函数的返回值存储在一个变量中，然后使用条件语句来根据用户的选择执行不同的操作。

总结confirm函数的使用方法：

1. 使用confirm函数来显示一个确认对话框，并获取用户的确认或取消操作。
2. 根据confirm函数的返回值来确定用户的选择。
3. 可以将confirm函数的返回值存储在一个变量中，然后使用条件语句来根据用户的选择执行不同的操作。
4. 需要注意在条件语句中处理用户关闭对话框的情况。

需要注意的是，如果用户关闭了对话框而没有点击确认或取消按钮，confirm函数将返回undefined。因此，在使用confirm函数时，最好在条件语句中添加一个判断条件来处理这种情况。

⭐三、prompt

1、什么是prompt？

prompt是JavaScript中一种常用的交互函数，用于显示一个提示框并获取用户的输入数据。其基本语法为prompt(message, defaultValue)，其中message是一个字符串参数，用于显示在提示框中的消息，defaultValue是一个可选参数，用于设置提示框中输入框的默认值。

使用prompt函数时需要注意以下几点：

1. 默认值的设置：defaultValue参数是可选的，如果不提供默认值，则输入框将为空。如果需要在输入框中显示一个默认值，可以通过设置defaultValue参数来实现。请注意，即使设置了默认值，用户仍然可以编辑输入框中的内容。

2. 返回值的处理：prompt函数返回用户输入的内容作为一个字符串。在后续处理用户输入的值时，可能需要进行类型转换，因为返回的值始终是字符串类型。如果用户点击取消按钮，返回值将为null，需要进行判断确保返回的值不为null再进行后续操作。

3. 安全性考虑：由于输入框是由用户输入的，因此在处理用户输入时需要进行安全性考虑。用户可能输入恶意代码或非预期的内容，需要对输入进行验证、过滤或转义，以确保应用程序的安全性。

4. 用户体验的优化：prompt函数会阻塞页面的执行，直到用户关闭提示框。这可能会影响用户体验，特别是在WEB应用中。因此，在使用prompt函数时，应考虑是否有更好的方式来实现用户交互，以提升用户体验。

使用prompt注意事项：

• 提示信息要明确、清晰。
• 默认值是可选的，可以设置一个默认值。
• 返回的值始终是字符串类型，可能需要进行类型转换。
• 返回值可能为null，需要进行判断。
• 需要对用户输入进行安全性处理。
• 考虑使用更好的方式提升用户体验。

2、使用prompt

prompt的定义和用法：prompt()方法用于显示可提示用户进行输入的对话框。

这个方法返回用户输入的字符串。

prompt的语法：prompt(message，defaultValue);

使用prompt函数的基本语法如下：

prompt(message, defaultValue)

其中，message是一个字符串，用于提示用户输入的信息。defaultValue是一个可选参数，用于设置输入框中的默认值。当用户点击提示框上的确定按钮时，prompt函数将返回用户输入的内容作为一个字符串。 

参数	描述
message	可选。要在对话框中显示的纯文本（而不是 HTML 格式的文本）。
defaultValue	可选。默认的输入文本。

prompt的代码示例：显示一个提示框，询问她/他的名字，然后编写一个页面的问候：

function myFunction(){ 
    var person=prompt("请输入你的名字","Harry Potter"); 
    if (person!=null && person!=""){ 
        var x="你好 " + person + "! 今天感觉如何?"; 
        document.getElementById("demo").innerHTML=x; 
    } 
}

3、总结prompt

使用prompt函数时，会显示一个带有输入框、确认和取消按钮的提示框，用户可以在输入框中输入数据并点击确认或取消按钮来确定或取消操作。当用户点击确认按钮时，prompt函数返回输入框中的数据，表示用户的输入；当用户点击取消按钮时，prompt函数返回null，表示取消操作。

prompt函数返回的是一个字符串，即使用户输入的是数字或其他类型的值，也会被转换为字符串类型。因此，在后续处理用户输入时，可能需要进行类型转换或其他操作。

总结prompt函数的使用方法：

1. 使用prompt函数来显示一个提示框，并获取用户的输入数据。
2. 根据prompt函数的返回值来获取用户的输入数据。
3. 可以将prompt函数的返回值存储在一个变量中，然后使用条件语句或其他操作来处理用户的输入数据。
4. 需要注意对用户输入数据的有效性进行验证或处理。

需要注意的是，用户可以在输入框中输入任何数据，包括空字符串或无效数据。因此，在使用prompt函数获取用户输入数据时，最好进行一些验证或处理，以确保输入数据的有效性。

⭐alert、confrim和prompt的区别

alert、confirm和prompt是JavaScript中常用的弹出框函数，它们的区别如下：

1、alert函数：alert函数用于显示一个消息框，通常用于向用户显示一些提示或警告信息。它只有一个参数，即要显示的消息内容。用户无法更改或输入任何值，只能关闭消息框。alert函数返回值为undefined。

2、confirm函数：confirm函数用于显示一个确认框，通常用于让用户做出确认或取消的选择。它有一个参数，即要显示的确认消息内容。确认框中有两个按钮，分别是确定和取消。用户可以点击确定或取消按钮，点击确定按钮返回值为true，点击取消按钮返回值为false。

3、prompt函数：prompt函数用于显示一个输入框的消息框，通常用于获取用户输入的值。它有两个参数，第一个参数是要显示的消息内容，第二个参数是输入框的默认值。用户可以在输入框中输入值，并点击确定或取消按钮。点击确定按钮返回用户输入的值作为一个字符串，点击取消按钮返回值为null。

综上所述，alert用于显示提示信息、confirm用于确认或取消选择、prompt用于获取用户输入。它们在用户交互和返回值上有区别。

alert、confrim和prompt的区别总结：

• alert用于显示一条消息，没有返回值。
• confirm用于确认或取消某个操作，返回一个布尔值。
• prompt用于输入信息，返回用户输入的内容或null

总结不易，希望宝宝们不要吝啬亲爱的哟(＾Ｕ＾)ノ~ＹＯ！如有问题，欢迎评论区批评指正