JavaScript 输出


JavaScript 没有任何打印或者输出的函数。

JavaScript 显示数据

JavaScript 可以通过不同的方式来输出数据:

  • 使用 window.alert() 弹出警告框。
  • 使用 document.write() 方法将内容写到 HTML 文档中。
  • 使用 innerHTML 写入到 HTML 元素。
  • 使用 console.log() 写入到浏览器的控制台。

使用 window.alert()

你可以弹出警告框来显示数据:

实例

<!DOCTYPE html>
<html>
<body> <h1>我的第一个页面</h1>
<p>我的第一个段落。</p> <script>
window.alert(5 + 6);
</script> </body>
</html>

操作 HTML 元素

如需从 JavaScript 访问某个 HTML 元素,您可以使用 document.getElementById(id) 方法。

请使用 "id" 属性来标识 HTML 元素,并 innerHTML 来获取或插入元素内容:

实例

<!DOCTYPE html>
<html>
<body> <h1>我的第一个 Web 页面</h1> <p id="demo">我的第一个段落</p> <script>
document.getElementById("demo").innerHTML = "段落已修改。";
</script> </body>
</html>

以上 JavaScript 语句(在 <script> 标签中)可以在 web 浏览器中执行:

document.getElementById("demo") 是使用 id 属性来查找 HTML 元素的 JavaScript 代码 。

innerHTML = "段落已修改。" 是用于修改元素的 HTML 内容(innerHTML)的 JavaScript 代码。


在本教程中

在大多数情况下,在本教程中,我们将使用上面描述的方法来输出:

上面的例子直接把 id="demo" 的 <p> 元素写到 HTML 文档输出中:


写到 HTML 文档

出于测试目的,您可以将JavaScript直接写在HTML 文档中:

实例
<!DOCTYPE html>
<html>
<body> <h1>我的第一个 Web 页面</h1> <p>我的第一个段落。</p> <script>
document.write(Date());
</script> </body>
</html>

请使用 document.write() 仅仅向文档输出写内容。

如果在文档已完成加载后执行 document.write,整个 HTML 页面将被覆盖。

JavaScript 简版-菜鸟中的菜鸟2的更多相关文章

  1. JavaScript 简版-菜鸟中的菜鸟

    JavaScript 简介 JavaScript 是互联网上最流行的脚本语言,这门语言可用于 HTML 和 web,更可广泛用于服务器.PC.笔记本电脑.平板电脑和智能手机等设备. JavaScrip ...

  2. Virtex6 PCIe 超简版基础概念学习(二)

    Virtex6 PCIe 超简版基础概念学习(二) 分类:FPGAPCIe (2081)  (0)  举报  收藏 文档版本 开发工具 测试平台 工程名字 日期 作者 备注 V1.0 ise14.7 ...

  3. typescript 简版跳一跳

    typescript 简版跳一跳 学习typescript,第一步应该是学习官方文档,理解最基础的语法.第二步开始用typescript实现一些js+css 或者canvas类型的游行.现在开始我们用 ...

  4. python练习_购物车(简版)

    python练习_购物车(简版) 需求: 写一个python购物车可以输入用户初始化金额 可以打印商品,且用户输入编号,即可购买商品 购物时计算用户余额,是否可以购买物品 退出结算时打印购物小票 以下 ...

  5. FFmpeg简易播放器的实现-最简版

    本文为作者原创:https://www.cnblogs.com/leisure_chn/p/10040202.html,转载请注明出处 基于FFmpeg和SDL实现的简易视频播放器,主要分为读取视频文 ...

  6. 【Spring源码解析】—— 简单工厂模式的BeanFactory的超简版实现

    一.什么是简单工厂模式 设计模式的核心是“分工”,通过分工将对象与职责划分的更细化,进而提升系统设计的可扩展性,使其更容易维护. 开闭原则:对扩展开放,对修改关闭:要增加一个新的处理逻辑,可以开一个新 ...

  7. JavaScript事件在WebKit中的处理流程研究

    本文主要探讨了JavaScript事件在WebKit中的注冊和触发机制. JS事件有两种注冊方式: 通过DOM节点的属性加入或者通过node.addEventListener()函数注冊: 通过DOM ...

  8. SpringBoot2+Netty打造通俗简版RPC通信框架(升级版)

    背景         上篇文章我简单的介绍了自己打造的通俗简版RPC通信框架,这篇是对简版的增强~         如果大家对此项目还感兴趣的话,可到码云上瞄瞄:Netty-RPC         上 ...

  9. SpringBoot2+Netty打造通俗简版RPC通信框架

    2019-07-19:完成基本RPC通信! 2019-07-22:优化此框架,实现单一长连接! 2019-07-24:继续优化此框架:1.增加服务提供注解(带版本号),然后利用Spring框架的在启动 ...

随机推荐

  1. 再谈 PHP 未来之路

    前段时间我写过一篇博文<phper:敢问路在何方>,分析了 PHPer 的困境以及 PHP 程序员的学习.进阶突破之路.同时我在知乎上也发过类似的提问.从大家的评论和回答看,大体分为以下几 ...

  2. C - Ordering Pizza CodeForces - 867C 贪心 经典

    C - Ordering Pizza CodeForces - 867C C - Ordering Pizza 这个是最难的,一个贪心,很经典,但是我不会,早训结束看了题解才知道怎么贪心的. 这个是先 ...

  3. (二)Redis在Mac下的安装与SpringBoot中的配置

    1 下载Redis 官网下载,下载 stable 版本,稳定版本. 2 本地安装 解压:tar zxvf redis-6.0.1.tar.gz 移动到: sudo mv redis-6.0.1 /us ...

  4. learn from collection framework design

    最难忍受的痛苦,也许是想干一件事情而又不去干.--罗曼·罗兰 前言 本篇文章算是拾人牙慧吧,偶尔谷歌到一个能很好把collection framework design讲好的文档,一是为了总结提升,也 ...

  5. vs每次生成都全部编译的问题

    最近vs每次生成都会编译整个工程,经查找为.qrc中的资源路径不存在导致,删除路径后问题解决. 原文来自微信公众号"程序员成长日志",已经工作的程序员朋友可以关注下,分享日常工作中 ...

  6. OpenCV 经纬法将鱼眼图像展开

    文章目录 前言 理论部分 鱼眼展开流程 鱼眼标准坐标计算 标准坐标系与球坐标的转换 代码实现 测试效果如下图 总结 this demo on github 前言 鱼眼镜头相比传统的镜头,视角更广,采集 ...

  7. 一篇博客带你轻松应对Springboot面试

    1. SpringBoot简介 SpringBoot是简化Spring应用开发的一个框架.他整合了Spring的技术栈,提供各种标准化的默认配置.使得我们可以快速开发Spring项目,免掉xml配置的 ...

  8. java接口自动化(五) - 企业级代码管理工具Git的配置

    1.简介 上一篇讲解完如何安装Git后,今天宏哥趁热打铁讲解一下Git的使用,要想使用Git,我们还需要做一些准备工作,首先你的拥有一个Git账号,所以如果你没有的话,就快速注册一个吧. 2.Git注 ...

  9. python学习第七天--文件系统常用模块os,os.path,pickle

    模块是一个可用代码段的打包,后缀名为py,可被别的程序引入#使用import OS模块:operting system操作系统#import os os.chdir(path) 改变当前工作目录 os ...

  10. [hdu4768]二分

    http://acm.hdu.edu.cn/showproblem.php?pid=4768 题意:n个传单分别发给编号为ai, ai + ci, ai + 2 * ci, .. , ai + k * ...