03JavaScript 输出
JavaScript 输出
JavaScript 没有任何打印或者输出的函数。
先来一点DOM的小知识点:
DOM 解释:
- 您会经常看到 document.getElementById("id")。
- 这个方法是 HTML DOM 中定义的。
- DOM (Document Object Model)(文档对象模型)是用于访问 HTML 元素的正式 W3C 标准。
- 格式<script>
- 那些老旧的实例可能会在 <script> 标签中使用 type="text/javascript"。
- 现在已经不必这样做了。
- JavaScript 是所有现代浏览器以及 HTML5 中的默认脚本语言
JavaScript 显示数据
JavaScript 可以通过不同的方式来输出数据:
- 使用 window.alert() 弹出警告框。
- 使用 document.write() 方法将内容写到 HTML 文档中。
- 使用 innerHTML 写入到 HTML 元素。
- 使用 console.log() 写入到浏览器的控制台。
1.使用 window.alert()
实例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Yubaba</title>
</head>
<body> <h1>我的第一个页面</h1>
<p>我的第一个段落。</p>
<script>
window.alert("有新的公告,请注意查看!");
</script> </body>
</html>
2.操作 HTML 元素
如需从 JavaScript 访问某个 HTML 元素,您可以使用 document.getElementById(id) 方法。
请使用 "id" 属性来标识 HTML 元素,并 innerHTML 来获取或插入元素内容:
(document.write是直接写入到页面的内容流,如果在写之前没有调用document.open, 浏览器会自动调用open。每次写完关闭之后重新调用该函数,会导致页面被重写。innerHTML则是DOM页面元素的一个属性,代表该元素的html内容。你可以精确到某一个具体的元素来进行更改。如果想修改document的内容,则需要修改document.documentElement.innerElement。 innerHTML很多情况下都优于document.write,其原因在于其允许更精确的控制要刷新页面的那一个部分。)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Yubaba丶</title>
</head>
<body> <h1>我的第一个 Web 页面</h1>
<p id="demo">我的第一个段落。</p>
<script>
document.getElementById("demo").innerHTML="段落已修改。";
</script> </body>
</html>
3.写到控制台
如果您的浏览器支持调试,你可以使用 console.log() 方法在浏览器中显示 JavaScript 值。
浏览器中使用 F12 或Fn+F12来启用调试模式, 在调试窗口中点击 "Console" 菜单。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Yubaba丶</title>
</head>
<body> <h1>我的第一个 Web 页面</h1>
<p>
浏览器中(Chrome, IE, Firefox) 使用 F12 来启用调试模式, 在调试窗口中点击 "Console" 菜单。
</p>
<script>
a = 5;
b = 6;
c = a + b;
console.log(c);
</script> </body>
</html>
03JavaScript 输出的更多相关文章
- mapreduce多文件输出的两方法
mapreduce多文件输出的两方法 package duogemap; import java.io.IOException; import org.apache.hadoop.conf ...
- Android Studio 多个编译环境配置 多渠道打包 APK输出配置
看完这篇你学到什么: 熟悉gradle的构建配置 熟悉代码构建环境的目录结构,你知道的不仅仅是只有src/main 开发.生成环境等等环境可以任意切换打包 多渠道打包 APK输出文件配置 需求 一般我 ...
- nodejs进阶(1)—输出hello world
下面将带领大家一步步学习nodejs,知道怎么使用nodejs搭建服务器,响应get/post请求,连接数据库等. 搭建服务器页面输出hello world var http = require ...
- .NET Core的日志[2]:将日志输出到控制台
对于一个控制台应用,比如采用控制台应用作为宿主的ASP.NET Core应用,我们可以将记录的日志直接输出到控制台上.针对控制台的Logger是一个类型为ConsoleLogger的对象,Consol ...
- WebApi接口 - 响应输出xml和json
格式化数据这东西,主要看需要的运用场景,今天和大家分享的是webapi格式化数据,这里面的例子主要是输出json和xml的格式数据,测试用例很接近实际常用情况:希望大家喜欢,也希望各位多多扫码支持和点 ...
- node中子进程同步输出
管道 通过"child_process"模块fork出来的子进程都是返回一个ChildProcess对象实例,ChildProcess类比较特殊无法手动创建该对象实例,只能使用fo ...
- Java程序:从命令行接收多个数字,求和并输出结果
一.设计思想:由于命令行接收的是字符串类型,因此应先将字符串类型转化为整型或其他字符型,然后利用for循环求和并输出结果 二.程序流程图: 三.源程序代码: //王荣荣 2016/9/23 ...
- 【夯实PHP基础】nginx php-fpm 输出php错误日志
本文地址 原文地址 分享提纲: 1.概述 2.解决办法(解决nginx下php-fpm不记录php错误日志) 1. 概述 nginx是一个web服务器,因此nginx的access日志只有对访问页面的 ...
- 【SAP业务模式】之ICS(六):发票输出类型
这篇开始主要讲述发票输出类型: 首先我们新建一个发票类型,用于公司间的发票MIV,而标准的发票类型还是F2保持不变: 一.新建发票类型: 目录:SPRO-销售与分销-出具发票-开票凭证-定义出具发票类 ...
随机推荐
- vue2.0中的ref.html
前置知识请戳这里 获取DOM对象以及组件对象 <!DOCTYPE html> <html> <head> <meta charset="UTF-8& ...
- Spring返回json数据
第一种形式:使用注解@ResponseBody @RequestMapping(value = "/admin/jq", method = RequestMethod.GET) @ ...
- c# 知识学习
1.C#基础知识梳理系列 2.详解C#委托,事件与回调函数 3.C#制作Windows service
- centos7 nginx访问目录403解决
查看 /usr/sbin/sestatusSELinux status是不是enabled 然后 vi /etc/selinux/config修改:SELINUX=disabledreboot
- 财务软件(gnucash)
apt-get install gnucash
- 用w32tm设置服务器时间同步
服务器时间同步是一个容易被忽视的问题,但在企业级应用环境中,不同服务器之间的时间差很可能引发应用系统问题.Windows提供的w32tm程序可以用来设置时间同步服务器,其用法如下: 1.指定外部时间源 ...
- swift的动态库
共享可执行文件 iOS 有沙箱机制,不能跨App间共享共态库,但Apple开放了App Extension,可以在App和Extension间共间动态库(这也许是Apple开放动态链接库的唯一原因了) ...
- Mac 导入maven项目详解
1.打开Eclipse,选择Help->Install New SoftWare2.点击add 地址输入:http://m2eclipse.sonatype.org/sites/m2e,name ...
- UVA10820 Send a Table
嘟嘟嘟 [欧拉函数] 大致题意:如果知道f(a, b),就可以求出f(a * k, b * k).现给出一个n,求至少需要知道几个二元组(a, b),使所有的f(x, y)都能求出来.(1 <= ...
- sql注入二
大家早上好!今天由我给大家带来<web安全之SQL注入篇>系列晨讲,首先对课程进行简单介绍,SQL注入篇一共分为三讲: 第一讲:“纸上谈兵:我们需要在本地架设注入环境,构造注 ...