前端输出测试语句……（实⽤篇）javascript输出测试语句的三种⽅式（常⽤)
<!DOCTYPE html>
<html>
html内容文本框<head>
<meta charset="UTF-8">
<title></title>
<!--将JS代码编写到script标签中-->
<script type="text/javascript">
alert("Hello World"); /*控制浏览器弹出⼀个提⽰框*/
document.write("来啦");
/*控制浏览器在页⾯中输出⼀个内容document.write()向body中写⼀个内容*/
console.log("被发现了~~~"); /*向控制台输出⼀个内容*/
</script>
</head>
<body>
</body>
</html>
扩展：
1、alert("要输出的内容");
->在浏览器中弹出⼀个对话框，然后把要输出的内容展⽰出来
->alert都是把要输出的内容⾸先转换为字符串然后在输出的
2、document.write("要输出的内容");
-
>直接的在页⾯中展⽰输出的内容
3、console.log("要输出的内容");
->在控制台输出内容
<("我是错误") // 了解
Console.warn("我是⼀个警告"）//了解
4、value ->给⽂本框(表单元素)赋值内容
->获取⽂本框中(表单元素)的内容
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "/TR/html4/loose.dtd"> <html>
<head>
<meta charset="UTF-8">
<script src="jquery-3.4.1.js"></script>
<script>
function changestatus(){
//$("#money").val(888);//val()这种写法有时会失效，特别是他的⽗元素是dosplay:none时
$("#money").attr("value",888);//推荐这种写法，可正常赋值
//ElementById("money").value=888;//js原始写法
}
</script>
</head>
<body>
<input id="money" type="text">
<button onclick="changestatus()">加⼯资</button>
</body>
</html>
5、innerHTML/innerText ->给除了表单元素的标签赋值内容
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "/TR/html4/loose.dtd"> <html>
<body>
<h1>我的第⼀张⽹页</h1>
<p>我的第⼀个段落</p>
<div>六六</div><p id="demo"></p>
<script>
//ElementById("demo").innerHTML = 6 + 6;
</script>
</body>
</html>
6、Confirm(" 输出带有是否的弹出框")
a）点击确定返回true
d) 点击取消返回false
confirm在alert的基础上增加了让⽤户选择性操作（提供两个按钮：确定和取消）
注意：输出格式也和alert⼀样也是字符串格式的。
var flag = confirm(‘确定要删除吗？’);
alert(flag);
当⽤户点击确定按钮的时候，得到的结果是布尔类型的true，点击取消或者点击关闭“x”，得到的布尔类型的false，此时我们可以根据接受的结果做不同的处理就知道⽤户进⾏什么样的操作了
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "/TR/html4/loose.dtd">
<html>
<head>
<meta charset="UTF-8">
<script>
function rusure()
{
question = confirm("确实要去进⼊吗?")
console.log(question);
if (question !="0"){
window.open("","测试公告窗⼝","width=340,height=163,toolbar=0,status=0,menubar=0,resize=0");
}
}
</script>
</head>
<body>
<a href="" onClick="rusure() ;return false;">来点击我</a>
</body>
</html>
7、Prompt("输⼊框")；
a) 输⼊内容被返回
d)不输⼊内容返回null
在confirm 的基础上增加⼀个输⼊框，可以让⽤户输⼊⼀些⽂字
例如：删除的时候除了提⽰⽤户是否要删除，⽽且还想让⽤户输⼊删除的原因，这时候就可以使⽤prompt()。
var flag = prompt('确定要删除吗');
alert(flag);
当⽤户点击确定按钮的时候，我们可以获取到⽤户输⼊的内容，获取的内容是字符串格式的。（如果⽤户没输⼊内容获取到的结果是空字符串）；当⽤户点击取消或者“X”，得到的结果是null。
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "/TR/html4/loose.dtd"> <html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
function disp_prompt(){
var name = prompt("请输⼊您的名字","LALALA")
if(name!=null && name !=""){
document.write("Hello,"+ name);
}
}
</script>
</head>
<body>
<input type="button" onclick="disp_prompt()" value="显⽰⼀个提⽰框" />
</body>
</html>
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。
发表评论