js三种消息框总结-警告框、确认框、提示框

js消息框类别:警告框、确认框、提示框

警告框:alert("文本");

确认框:confirm("文本");

提示框:prompt("文本","默认值");

一:confirm使用范例

<script type="text/javascript">

           function test(){

                 var res = confirm("请选择");

                  if(res == true){

                        document.write("你点击了确定");

                   }else{

                         document.write("你点击了取消");

                    }

            }

</script>

<input type="button" οnclick="test()" value="confirm使用范例">

二:prompt使用范例:

<script type="text/javascript">

    function test(){

          var name = prompt("名称","jack");

          if(name!=null && name!=""){

               document.write("hello" + name);

           }

    }

</script>

<input type="button" οnclick="test()" value="prompt使用范例">

  • 1
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
基于Element UI架的警告提示消息可以在HTML文件中编写,通常情况下,我们会将其放在需要提示的页面的相应位置。具体来说,可以按照以下步骤进行编写: 1. 引入Element UI架的CSS和JS文件。 ```html <!-- 引入Element UI架的CSS文件 --> <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"> <!-- 引入Element UI架的JS文件 --> <script src="https://unpkg.com/vue/dist/vue.js"></script> <script src="https://unpkg.com/element-ui/lib/index.js"></script> ``` 2. 在页面中添加一个提示消息的容器,并设置其样式和位置。 ```html <div role="alert" class="el-message el-message--warning" style="top: 20px; z-index: 2880;"></div> ``` 其中,`role="alert"`表示这是一个提示消息,`class="el-message el-message--warning"`表示设置提示消息的样式,`style="top: 20px; z-index: 2880;"`表示设置提示消息的位置和层级。 3. 使用JavaScript代码生成提示消息,并将其添加到容器中。 ```javascript // 获取提示消息的容器 var messageContainer = document.querySelector('.el-message'); // 创建提示消息内容的DOM元素 var messageContent = document.createElement('p'); messageContent.className = 'el-message__content'; messageContent.innerHTML = '<div style="margin:5px 5px; text-align: center;">[设备离线]</div>'; // 创建提示消息图标的DOM元素 var messageIcon = document.createElement('i'); messageIcon.className = 'el-message__icon el-icon-warning'; // 将提示消息内容和图标添加到提示消息容器中 messageContainer.appendChild(messageIcon); messageContainer.appendChild(messageContent); ``` 在上述代码中,我们首先获取了提示消息的容器`messageContainer`,然后使用`createElement`方法创建了提示消息内容和图标的DOM元素,分别为`messageContent`和`messageIcon`。最后,我们将这两个DOM元素添加到提示消息容器中,从而实现了一个基于Element UI架的警告提示消息。 需要注意的是,以上代码仅提供了基本的实现方式,具体的实现方式可能因项目而异,需要根据具体情况进行调整。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值