JavaScript输出与交互

开发工具与关键技术：VS JavaScript
作者： 谭智聪
撰写时间：2020年8月16日

JavaScript输出与交互的主要方法：
方法 作用
document.write() 向HTML文档中输出内容
console.log() 写到浏览器的控制台
window.alert() 弹出提示框
window.confirm() 弹出消息对话框通常用于允许用户做选择的动作
window.prompt() 弹出消息对话框，通常用于询问一些需要与用户交互的信息
1、 document.write()
document.write() 可用于直接向HTML文档写内容。简单的说就是直接在网页中输出内容。
语法： document.write(字符串或变量);
第一种：输出内容用””括起，直接输出””号内的内容。

<script>
	//第一种：输出内容用””括起，直接输出””号内的内容。
	document.write(”Hello World!”);
</script>

第二种：通过变量，输出内容

<script>
	//第二种：通过变量，输出内容
	var mystr = ”hello world!”;
	document.write(mystr);
<script>

2、 console.log()
console.log() 可用于将内容输出到浏览器控制台，便于开发过程中的调试；用法和document.write()类似可以直接输出内容，也可以输出变量。
语法：console.log(字符串或变量)；

<script>
	//第一种：输出内容用””括起，直接输出””号内的内容。
	console.log(”Hello world!”);

	//第二种：通过变量，输出内容
	var mystr = ”</br>hello world!”;
	console.log(mystr);
</script>

3、 window.alert()
window.alert()弹出消息对话框（包含一个确定按钮）。一般window省略不写，直接使用alert()
语法：alert(字符串或变量)；

<script>
	//第一种：输出内容用””括起，直接输出””号内的内容。
	alert(”Hello World!”);

	//第二种：通过变量，输出内容
	var mystr = ”</br>hello world!”;
	alert(mystr);
</script>

4、 window.confirm()
confirm 消息对话框通常用于允许用户做选择的动作，如：“确定吗？”等。弹出对话框（包括一个确定按钮和一个取消按钮）。一般window省略不写，直接使用confirm()
语法：confirm(字符串或变量)；

<script>
	//======confirm();
	var mymessage = window.confirm(”你喜欢JavaScript吗?”);
	if (mymessage == true) {
		document.write(”努力学习，加油！”);
    } else {
	    Document.write(”JS很重要，要认真学习喔！”);
    }
</script>

5、 window.prompt()
prompt弹出消息对话框，通常用于询问一些需要与用户交互的信息。弹出消息对话框（包含一个确定按钮、取消按钮与一个文本输入框）。一般window省略不写，直接使用prompt()
语法：prompt(str1,[str2]);
参数说明：

 1. str1:要显示在消息对话框中的文本，不可修改
 2. str2：（可选）文本框中的内容，可以修改；

返回值：

1. 点击确定按钮，文本框中的内容将作为函数返回值
2. 点击取消按钮，将返回null

<script>
	var myname = prompt(”请输入你的姓名：”,”默认可选”);
	if (myname != null) {
		alert(”你好”+ myname);
	} else {
		alert(”你没有输入”);
	}
</script>