首页 > 编程语言 >【JavaScript保姆级教程】输出函数和初识变量

【JavaScript保姆级教程】输出函数和初识变量

时间:2023-09-19 18:31:35浏览次数:47  
标签:教程 变量 示例 代码 JavaScript 初识 控制台 函数

@TOC


前言

JavaScript是一种强大的脚本语言,广泛应用于网页开发和应用程序编写。本文将全面介绍JavaScript中输出内容的方法,包括使用document.write()函数、调试工具如console.log()和对话框函数如alert(),以及变量的声明和赋值。此外,我们还将探索输入提示框prompt()函数的使用方法。深入理解这些概念和技术,将为您在JavaScript编程中提供帮助。


一、输出内容

在JavaScript中,我们可以使用不同的方法输出内容到浏览器或开发工具的控制台。

1.1 document.write()函数

document.write()函数用于将内容直接写入HTML文档中。这个函数可以在运行时向页面添加内容。示例代码如下: html

<!DOCTYPE html>
<html>
<head>
  <title>JavaScript示例</title>
</head>
<body>
  <script>
    document.write("我是div标签");
  </script>
</body>
</html>

执行上述代码时,将向浏览器输出"我是div标签"。

1.2 console.log()函数

console.log()函数用于在控制台打印消息,可以帮助我们进行调试和输出结果。示例代码如下: javascript

console.log("这是控制台输出的消息");

执行上述代码时,消息"这是控制台输出的消息"将出现在开发工具的控制台中。

查看终端输出信息

【JavaScript保姆级教程】输出函数和初识变量_赋值

首先写一个log打印函数,然后我们运行他!

1、vscode中查看:

【JavaScript保姆级教程】输出函数和初识变量_示例代码_02

运行后,在vscode下面的调试控制台,就可以看到我们的打印的东西了!2、浏览器中查看

1.按F12

【JavaScript保姆级教程】输出函数和初识变量_赋值_03

2.点击“打开开发工具”3.点击控制台

【JavaScript保姆级教程】输出函数和初识变量_示例代码_04

我们可以看到我们打印的了Hello world了

1.3 alert()函数

alert()函数用于在浏览器中显示一个带有确认按钮的对话框。这个函数通常用于向用户显示重要信息或要求用户进行操作。示例代码如下:javascript

alert("这是一个提示框");

执行上述代码时,将弹出一个对话框,显示消息"这是一个提示框"。

【JavaScript保姆级教程】输出函数和初识变量_赋值_05

我们还可以点击“确定”关闭他!

二、变量的使用

在JavaScript中,变量用于存储和操作数据。变量可以被声明和赋值。

1.1 变量的声明

可以使用let关键字来声明一个变量。示例代码如下:javascript

var x

上述代码声明了一个名为x的变量。

1.3变量的赋值

可以使用赋值操作符=将值赋给变量。示例代码如下:javascript

x = 5

上述代码将值5赋给变量x。

1.4 变量的声明和赋值

还可以在声明变量的同时进行赋值操作。示例代码如下:javascript

let y = 10

上述代码声明了一个名为y的变量,并将值10赋给它。

三、输入提示框的使用

prompt()函数用于显示一个带有输入框和确认按钮的对话框,以便用户输入数据。示例代码如下:

javascript

let name = prompt("请输入您的姓名:");
console.log("欢迎您," + name + "!");

上述代码将弹出一个对话框,要求用户输入姓名,并将输入的姓名存储在变量name中。然后,通过console.log()函数在控制台输出欢迎消息。

【JavaScript保姆级教程】输出函数和初识变量_赋值_06

【JavaScript保姆级教程】输出函数和初识变量_赋值_07

可以看到,这里就可以输入,可以点击确定/取消,输入完成点击确定后,就返回给named变量,然后打印出来!

【JavaScript保姆级教程】输出函数和初识变量_javascript_08

【JavaScript保姆级教程】输出函数和初识变量_示例代码_09

可以看到,这里也是打印出来了。通过几节课的学习Javascript,可以看到,他非常的简单,Easy!


总结

本文深入探讨了JavaScript中输出内容的几种方法,包括使用document.write()将内容写入HTML文档、使用console.log()在控制台打印消息和使用alert()显示对话框。同时,我们还学习了变量的声明和赋值,以及使用prompt()函数获取用户输入。这些知识将为您在JavaScript编程中提供更多灵活性和功能。通过熟练掌握这些概念和技术,您将能够开发出交互性强的网页和应用程序。 JavaScript的广泛应用领域使得深入了解该语言的重要性不可忽视。通过不断学习和实践,您将能够利用JavaScript构建出更加强大和创新的应用。

标签:教程,变量,示例,代码,JavaScript,初识,控制台,函数
From: https://blog.51cto.com/u_16176403/7528040

相关文章

  • 无涯教程-JavaScript - SINH函数
    描述SINH函数返回数字的双曲正弦值。语法SINH(number)争论Argument描述Required/OptionalNumberAnyrealnumber.RequiredNotes双曲正弦的公式为-$$SINH\left(z\right)=\frac{e^z-e^{-z}}{2}$$适用性Excel2007,Excel2010,Excel2013,Excel2016Examp......
  • 1. 初识数据库
    ###数据库的本质```python"""本质其实就是一款基于网络通信的应用程序那其实每个人都可以开发一款数据库软件因为它仅仅就是一个基于网络通信的应用程序也就意味着数据库软件其实有很多很多 关系型数据库 MySQL、oracle、db2、access、sqlserver 非关系型数据库 redis、mon......
  • Python API教程:API入门(上)
    什么是API?一个API,或被称为应用程序接口,是一个服务器为你提供一个接收或发送数据的代码。API通常用来接收数据。本文就集中焦点在此话题中。当我们想从一个API中接收数据,我们需要开始请求。请求可以包含整个Web。例如,你可以浏览博客文章。你的浏览器开始请求我们的Web服务器,会返回整......
  • 简单易懂的Linux RedHat安装教程,轻松搭建开发环境
    Linux RedHat是一款流行的操作系统,它拥有强大的稳定性和安全性,是许多企业和开发者首选的操作系统。本文将为你详细介绍如何从零开始安装LinuxRedHat并搭建你的开发环境。1.准备工作在安装LinuxRedHat之前,需要准备好以下物品:-一台电脑-一个USB启动盘-LinuxRedHat......
  • javascript单引号和双引号区别
    在一个网页中的按钮,写onclick事件的处理代码,不小心写成如下:<inputvalue="Test"type="button"οnclick="alert(""OK"");"/>IE提示出错后,再漫不经心地改为:<inputvalue="Test"type="button"οnclick="alert(\"......
  • 调用javascript的4钟方式
    <scripttype="text/javascript">document.write('调用方式一');</script><scriptlanguage="">document.write('调用方式二');</script><scriptlanguage="javascript">......
  • 无涯教程-JavaScript - SEC函数
    描述SEC函数返回Angular的割线。语法SEC(number)争论Argument描述Required/OptionalNumberNumberistheangleinradiansforwhichyouwantthesecant.RequiredNotes数字的绝对值必须小于2^27如果Angular为度,则将Angular乘以PI()/180或使用RADIANS函......
  • 如何在JavaScript中实现链表
      转载来自:https://www.freecodecamp.org/news/implementing-a-linked-list-in-javascript/  Ifyouarelearningdatastructures,alinkedlistisonedatastructureyoushouldknow.IfyoudonotreallyunderstanditorhowitisimplementedinJavaScript......
  • 无涯教程-JavaScript - ROUND函数
    描述ROUND函数将数字四舍五入为指定的位数。ROUND是Excel舍入函数之一。语法ROUND(number,num_digits)争论Argument描述Required/OptionalnumberThenumberthatyouwanttoround.Requirednum_digitsThenumberofdigitstowhichyouwanttoroundthenum......
  • SpringBoot 后端配置 Https 教程
    以阿里云为例子1.申请SSL证书1.注册域名打开阿里云官网,搜索域名点击域名注册,输入域名,点击搜索选择心仪的域名,点击购买,打钱进入域名控制台,进行实名认证2.申请SSL证书打开阿里云官网,搜索SSL证书点击免费证书,领取20张券(一年可以领20张,可以创建20张免......