Javascript入门弹出方框

Posted 2020-10-28 Jomini

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Javascript入门弹出方框相关的知识，希望对你有一定的参考价值。

今天要javascript做一个用网页弹出框框的效果，虽然没什么卵用。

效果如图，弹出一个“hello world”的框框。

1. 新建一个html 页面, 如图：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

</body>
</html>

2. 接下有用三种方式弹出框框：

方式一：(不推荐)行间事件，直接在<body>里写入弹出信息。弹出方式, 打开页面，点击button，弹出

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <input type="button" name="" onclick="alert(\'ok\'!);">
</body>
</html>

方式二：页面script标签嵌入。弹出方式，打开页面直接弹出；

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript">
         var message = "Hello"
        alert(message);
   </script>
</head>
<body>
   
</body>
</html>

方式三：外部引入。弹出方式，打开页面直接弹出

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="js/test1.js"></script>
</head>
<body>
   
</body>
</html>

然后在js目录下新建一个文件 test1.js

alert(\'hello world\');

以上是关于Javascript入门弹出方框的主要内容，如果未能解决你的问题，请参考以下文章

opencv入门之五线性滤波（方框滤波均值滤波高斯滤波）

编译原理实战入门：用 JavaScript 写一个简单的四则运算编译器模拟执行

JavaScript快速入门-实战（例子）

VSCode自定义代码片段12——JavaScript的Promise对象

Android：将片段和弹出窗口的点击事件中生成的变量传递给活动的方法