一、document.write() 输出内容

document.write() 可用于直接在网页中输出内容。

方式1:输出内容用""括起,直接输出""号内的内容。

方式2:通过变量,输出内容。

方式3:输出多项内容,内容之间用+号连接。

方式4:输出HTML标签,并起作用,标签使用""括起来。

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>document.write输出内容</title>
<script type="text/javascript">
document.write("<声声慢> "); //方式1
var mystr1="寻寻觅觅 ";
var mystr2="冷冷清清 "; document.write(mystr1); //方式2
document.write(mystr1+mystr2+"凄凄惨惨戚戚 "); //方式3
document.write("乍暖还寒时候"+"</br>"); //方式4
document.write("最难将息"); </script>
</head>
<body>
</body>
</html>

运行效果:

<声声慢> 寻寻觅觅 寻寻觅觅 冷冷清清 凄凄惨惨戚戚 乍暖还寒时候
最难将息

二、alert消息对话框

alert输出内容,可以是字符串或变量,与document.write 相似。

语法:

alert(字符串或变量);  
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>函数调用</title>
<script type="text/javascript">
function add() //定义函数
{
var sum;
sum = 2 + 3;
alert(sum)
}
</script>
</head>
<body>
<form>
<!--调用函数-->
<input type="button" value="点击我" onclick="add()" />
</form>
</body>
</html>

运行效果:

三、confirm消息对话框

confirm 消息对话框通常用于允许用户做选择的动作,如:“你对吗?”等。弹出对话框(包括一个确定按钮和一个取消按钮)

语法:

confirm(str);

参数说明:

 str:在消息对话框中要显示的文本


返回值:返回true或false

当用户点击"确定"按钮时,返回true
当用户点击"取消"按钮时,返回false (注: 通过返回值可以判断用户点击了什么按钮。)

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>confirm</title>
<script type="text/javascript">
function rec(){
//定义confirm消息对话框
var mymessage=confirm("请问你是女士吗?");
if(mymessage==true)
{
document.write("你是女士!");
}
else
{
document.write("你是男士!");
}
}
</script>
</head>
<body>
<input name="button" type="button" onClick="rec()" value="点击我,弹出确认对话框" />
</body>
</html>

运行效果:

四、prompt 消息对话框

prompt弹出消息对话框,通常用于询问一些需要与用户交互的信息。弹出消息对话框(包含一个确定按钮、取消按钮与一个文本输入框)。


语法:

prompt(str1, str2);

参数说明:

str1: 要显示在消息对话框中的文本,不可修改
str2:文本框中的内容,可以修改

返回值:

1. 点击确定按钮,文本框中的内容将作为函数返回值
2. 点击取消按钮,将返回null
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>prompt</title>
<script type="text/javascript">
function rec(){
var score; //score变量,用来存储用户输入的年龄值。
score = prompt("请输入你的年龄:"); //定义prompt消息对话框
if(score>=25)
{
document.write("努力奋斗哦!");
}
else if(score>=18)
{
document.write("好好享受青春时光噢!");
}
else
{
document.write("做个快乐的孩子!");
}
}
</script>
</head>
<body>
<input name="button" type="button" onClick="rec()" value="点击我,输入年龄!" />
</body>
</html>

运行效果:

五、打开新窗口(window.open)

open() 方法可以查找一个已经存在或者新建的浏览器窗口。

语法:

window.open([URL], [窗口名称], [参数字符串])

六、关闭窗口(window.close)

语法

window.close();   //关闭本窗口

<窗口对象>.close();   //关闭指定的窗口
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>close()</title>
<script type="text/javascript">
// window.open() //打开空白页
var mywin=window.open("http://www.baidu.com", "_blank", "height=500 width=400") //打开窗口:百度
/*定义关闭窗口的函数*/
function Close(){
mywin.close(); //关闭窗口
} </script>
</head>
<body>
<input type='button' name='Buttn' value="点击我,关闭窗口" onClick="Close()">
</body>
</html>

运行效果:

参考:https://www.imooc.com

JS -- 基础语法1的更多相关文章

  1. JavaScript进阶 - 第2章 你要懂的规则(JS基础语法)

    第2章 你要懂的规则(JS基础语法) 2-1什么是变量 什么是变量? 从字面上看,变量是可变的量:从编程角度讲,变量是用于存储某种/某些数值的存储器.我们可以把变量看做一个盒子,盒子用来存放物品,物品 ...

  2. 【JS基础语法】---学习roadmap---6 parts

    JS基础语法---roadmap Part 1 - 2: Part 3 - 4:   Part 5 - 6

  3. 9.12/ css3拓展、js基础语法、程序基本知识、数据类型、运算符表达方式、语句知识点

    css3拓展: <display:none>  将某个元素隐藏       <visibility:hidden>  也是将某个元素隐藏 <display:block&g ...

  4. JS基础语法(二)

    目录 JavaScript基础语法(二) 八. 函数 1. 函数的概念 2. 函数的使用 声明函数 调用函数 3. 函数的封装 4. 函数的参数 函数的参数匹配问题 5. 函数返回值 6. argum ...

  5. JavaScript01 js基础语法,数据类型

    JavaScript的概述: 1.组成 三部分组成 ecmaScript 基础语法 (es5) dom document object model 文档对象模型 (操作html文档内容) bom bo ...

  6. JavaScript学习笔记 - 进阶篇(1)- JS基础语法

    前言 JavaScript能做什么? 1.增强页面动态效果(如:下拉菜单.图片轮播.信息滚动等) 2.实现页面与用户之间的实时.动态交互(如:用户注册.登陆验证等) JS进阶篇学习什么? 在JavaS ...

  7. 二、JavaScript语言--JS基础--JavaScript进阶篇--JS基础语法

    1.变量 定义:从字面上看,变量是可变的量:从编程角度讲,变量是用于存储某种/某些数值的存储器.我们可以把变量看做一个盒子,盒子用来存放物品,物品可以是衣服.玩具.水果...等. 命名:变量名字可以任 ...

  8. JS基础语法

    1.注释语法://单行注释./*多行注释*/. 2.输出语法:{1.alert("要输出的字符串"):.alert(输出其类型):  2.confirm():弹出一个可以和用户交互 ...

  9. Vue.js基础语法(三)

    vue学习的一系列,全部来自于表哥---表严肃,是我遇到过的讲课最通透,英文发音最好听的老师,想一起听课就去这里吧 https://biaoyansu.com/i/hzhj1206 1过滤器filte ...

  10. Vue.js基础语法(一)

    vue学习的一系列,全部来自于表哥---表严肃,是我遇到过的讲课最通透,英文发音最好听的老师,想一起听课就去这里吧 https://biaoyansu.com/i/hzhj1206 前言: 前端解析数 ...

随机推荐

  1. 阿里P8架构师大话设计模式,体会乐与怒的程序人生中值得回味一幕

    本书特色 本书有两个特色,第一特色是重视过程.看了太多的计算机编程类的图书,大多数书籍都是集中在讲授优秀的解决方案或者一个完美的程序样例,但对这些解决方案和程序的演变过程却重视不够,好书之所以好,就是 ...

  2. 7、TypeScript类型、接口、类、泛型综合使用 -- TypeScript封装统一操作Mysql Mongodb Mssql的底层类库。

    功能:定义一个操作数据库的库,支持Mysql Mssql Mongodb 要求:Mysql Mssql Mongodb功能一样 都有add.update.delete.get方法 注意:约束统一的规范 ...

  3. adb修改手机分辨率

    一.手机分辨率对照表 宽×高(标准值) 240×320 320×480 480×800 720×1280 1080×1920 1440×2560 DPI等级 LDPI MDPI HDPI XHDPI ...

  4. Jmeter 常用函数(7)- 详解 __time

    如果你想查看更多 Jmeter 常用函数可以在这篇文章找找哦 https://www.cnblogs.com/poloyy/p/13291704.html 作用 返回各种格式的当前时间 语法格式 ${ ...

  5. Logistic回归之有序logistic回归分析

    Logistic回归分析(logit回归)一般可分为3类,分别是二元logistic回归分析.多分类Logistic回归分析和有序Logistic回归分析.logistic回归分析类型如下所示. Lo ...

  6. py_选择排序

    # 选择排序 # 一趟排序记录最小值,放到第一个位置 #再一趟排序记录记录列表无序区最小的数,放到第二个位置 #.... # 关键点:有序区.无序区.无序区最小值 #方法一 def select_So ...

  7. Appium + Python App自动化第一个脚本

    今天跟大家讲解一个Appium和Python App自动化的脚本.[1]打开你的夜神模拟器(或者连接你的手机) [2]打开桌面的Appium [3]下载你要测的App的apk文件,放到桌面[4]拖动你 ...

  8. python - 平方根格式化 + 字符串分段组合

    题目来源:python123 平方根格式化 描述 获得用户输入的一个整数a,计算a的平方根,保留小数点后3位,并打印输出.‪‬‪‬‪‬‪‬‪‬‮‬‫‬‪‬‪‬‪‬‪‬‪‬‪‬‮‬‪‬‫‬‪‬‪‬‪‬‪ ...

  9. Java 的开发效率究竟比 C++ 高在哪里?

    有几个原因     大师助手解决你的烦恼1. 语言上,Java是一个比C++更容易parse得多的语言,所以相应的工具链IDE会更容易做,无论多大的Java的项目,就是新手写完都不会有编译错误.但是写 ...

  10. GitHub 热点速览 Vol.35:Let's Go,Rust 大放异彩

    摘要:语言之争,一直存在于各类社群,不论是单个编程语言的交流群,亦或是 NoSQL.云开发等技术群,总能看到"要不要换 Go"."Rust 比 C++ 更强"的 ...