今天要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. 简单ATM系统

    模拟实现一个ATM + 购物商城程序1.额度 15000或自定义2.实现购物商城,买东西加入 购物车,调用信用卡接口结账3.可以提现,手续费5%4.每月22号出账单,每月10号为还款日,过期未还,按欠 ...

  2. io系列之字节流

    java中io流系统庞大,知识点众多,作为小白通过五天的视频书籍学习后,总结了io系列的随笔,以便将来复习查看. 本篇为此系列随笔的第一篇:io系列之字节流. 一.字节流的File读写操作. Inpu ...

  3. Error[Pe020]: identifier "FILE" is undefined

    Error[Pe020]: identifier "FILE" is undefined 需要添加头文件:#include <stdio.h>

  4. Pyhton对象解释

    python的docstring提供了对每一个类.函数.方法的解释,在他们的定义下面可以有一行Python的标准字符串,该行字符串需要和下面的代码一样的缩进. docstring可以用单引号(')或者 ...

  5. Event Recommendation Engine Challenge分步解析第三步

    一.请知晓 本文是基于: Event Recommendation Engine Challenge分步解析第一步 Event Recommendation Engine Challenge分步解析第 ...

  6. R语言模块安装

    一.ggplot2 install.pacakges("ggplot2")

  7. NoSQL数据库Mongodb副本集架构(Replica Set)高可用部署

    NoSQL数据库Mongodb副本集架构(Replica Set)高可用部署 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. MongoDB 是一个基于分布式文件存储的数据库.由 C ...

  8. log4j、log4j2和slf4j的基本使用

    一.什么是log4j.log4j2和slf4j Log4j是Apache的一个开源项目,通过配置来控制日志的输出.主要是控制日志的输出级别.输出位置和输出内容格式. Log4j2是在log4j框架的基 ...

  9. 关于Android Studio开发环境变量的设置(avd启动黑屏)

    之前因为乱按网上的设置导致启动avd启动黑屏,查了很久原来是ANDROID_AVD_HOME变量没有加$符号 以下是正确的环境变量配置 添加环境变量(注意avd中有一个$符号) ANDROID_SDK ...

  10. HDU 1036(平均速度 **)

    题意是求出跑了 n 圈每圈 m km 的个人的平均速度. 控制格式,特别注意,题意是输出 -:--:-- 的该人成绩作废,但要把他其他的成绩输进去,不能直接就 break ,输出也就只有一个 - ,而 ...