今天要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入门(一)弹出方框的更多相关文章

  1. javaScript 删除事件 弹出确认 取消对话框

    javaScript 删除事件 弹出确认 取消对话框 1. <a href="javascript:if(confirm('确实要删除?'))location='http://www. ...

  2. JavaScript:九种弹出对话框

    [1.最基本的js弹出对话框窗口代码] 这是最基本的js弹出对话框,其实代码就几句非常简单: <script LANGUAGE="javascript"> <!- ...

  3. Javascript 访问网页弹出qq

    先在网页的正文结束位置 加上引用代码 代码如下 <SCRIPT type="text/javascript" src="/QQ.js"></S ...

  4. JavaScript三在弹出的对话框中

    据悉js小伙伴会发现,我们在某些情况下使用的alert()办法.prompt()办法.prompt()办法.它们在屏幕上的对话框.容,使用这样的方法使得页面的交互性更精彩.实际上我们常常会在进行网页浏 ...

  5. Javascript：猜猜弹出的是啥？为啥？

    背景 经常需要向新入职的年轻同学解释Javascript的两个概念:单线程和作用域链,今天就再写篇博客说明一下. 单线程 队列:只有一个用来存储回调方法的队列. 消费线程:只有一个消费线程,不停的从队 ...

  6. JavaScript三种弹出框（alert，confirm和prompt）用法举例

    http://blog.csdn.net/lucky51222/article/details/45604681 我们在做网页交互的时候往往需要用户在操作之前弹出一个提示消息框来让用户做一些点击才能继 ...

  7. javascript实现掉落弹出层------Day29

    顾名思义.所谓"掉落弹出层".就是出现一个弹出层,而出现的位置是从上方向下掉落.掉落到指定的位置停止,这样分析起来.和"右下角弹出提醒对话框"比起来,确有异曲同 ...

  8. Selenium入门10 弹出框的处理 switch_to.alert

      三种弹出框alert(一个按钮),confirm(两个确认,取消),prompt(两个按钮+输入框). 切换到弹框: switch_to_alert()  新版的selenium用:  brows ...

  9. 超级链接a中javascript:void(0)弹出另外一个框问题

    转字:http://my.oschina.net/castusz/blog/68186 结果在IE.Firefox.Chrome都是先执行的onclick事件,在项目中我们尽量不要同时使用这两种方式. ...

随机推荐

  1. vue购物车和地址选配（三）

    参考资料:vue.js官网 项目演示: 项目源代码: 核心代码及踩坑 删除: new Vue({ el:'#app', data:{ productlist:[], totalMoney:0, che ...

  2. C++ vector的运用

    C++ vector 用法(#include <vector>) 标准库Vector类型 使用需要的头文件: #include <vector> Vector:Vector 是 ...

  3. 上这个资源网站，让你轻松无忧找mac软件资源

    之前分享过好几篇关于mac软件相关的文章(想要看其他的mac软件专题文章,可以关注我,点击进入查看发表的文章),有网友表示,优质的软件推荐清单有了,想要下载和获取mac软件,买一个正版软件在APP s ...

  4. CentOS 安装最新版本 Git

    查看默认 yum 源的 git版本 # 安装 yum install -y git # 查看版本 git version # git version 1.8.3.1 参看官网,CentOS 安装新版本 ...

  5. mavan安装本地jar

    mvn install:install-file -Dfile=E:\IDEAworkspace\importAnalysisDemo\lib\IKAnalyzer2012_u6.jar -Dgrou ...

  6. 基于CentOS6.8版本配置真实域名的方法

    前言:审核了15天的时间终于审核下来了,但是结果发现配置域名掉坑了,记录一下 (一)首先配置域名三步走 1.先到域名商网站解析你你的域名(我的是百度云) 2.接着修改linux的host指向 例如: ...

  7. 剑指offer面试题4: 二维数组中的查找

    题目描述 在一个二维数组中(每个一维数组的长度相同),每一行都按照从左到右递增的顺序排序,每一列都按照从上到下递增的顺序排序.请完成一个函数,输入这样的一个二维数组和一个整数,判断数组中是否含有该整数 ...

  8. 使用C#的HttpWebRequest模拟登陆网站

    很久没有写新的东西了,今天在工作中遇到的一个问题,感觉很有用,有种想记下来的冲动. 这篇文章是有关模拟登录网站方面的. 实现步骤: 启用一个web会话 发送模拟数据请求(POST或者GET) 获取会话 ...

  9. hbase 实战项目

    首先 根据 hadoop 搭建 + hbase 搭建把 环境弄好 由于 hbase 依赖于 hdfs ,所以 需要 进入 hadoop -->sbin 下 启动 start-dfs.sh , s ...

  10. mvn项目压缩打包

    通常情况下,maven打包结果为jar或war包.如果需要一并打包配置文件等参数,通过resources配置指定需要打包的文件参数,如下示例: <project> ... <!-- ...