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-销售与分销-出具发票-开票凭证-定义出具发票类 ...
随机推荐
- c++开发ocx入门实践三--基于opencv的简易视频播发器ocx
原文:http://blog.csdn.net/yhhyhhyhhyhh/article/details/51404649 利用opencv做了个简易的视频播放器的ocx,可以在c++/c#/web ...
- SpringBoot2.0+Mybatis+PageHelper+Redis实现缓存
1.在maven引入相关的依赖 <parent> <groupId>org.springframework.boot</groupId> <artifactI ...
- AndroidStudio运行时出现错误:Instant Run requires 'Tools | Android | Enable ADB integration' to be enabled
本来想调出MMDS,没想到报出这个错误: 最后发现原来是自己选Android Device Monitor不小心把Enable ADB Integration前面的√去掉了.点击工具栏中的Tools, ...
- bootstrap 默认显示1899问题
今天使用bootstrap的 dateTimePicker控件时候,又碰到了去年的 显示 1899年的问题,之前解决过,但是忘记了.就记得 他的代码里面有一段是 说格式不正确或者 时间格式小于某个值时 ...
- PHP discuz模板语法
Discuz! X 模板的解析主要是 ./source/class/class_template.php 文件解析处理的,如果需要深入了解请可以看看这个文件! 模板嵌套语法 将被嵌套模板内容解析为 P ...
- SQL删除多列语句的写法
SQL删除表中多个列的写法: ALTER TABLE table_name DROP COLUMN COLUMN1,COLUMN COLUMN2,COLUMN COLUMN3 ……
- 导出IIS Log列表,导出站点下虚拟目录列表
Add-Type -AssemblyName System.Web import-module webadministration $ip = (gwmi Win32_NetworkAdapterCo ...
- error LNK1104: 无法打开文件“libzmq.lib”
vs 错误: error LNK1104: 无法打开文件“libzmq.lib” 解决方法: 你自己新建项目后,需要操作 项目>属性>链接器>常规>附加库目录>,然后把 ...
- TFS--解决新创建的windows用户无法访问TFS的问题
今天入职新同事,帮忙配置TFS的账号碰到一个问题,TFS账号是映射取administrators组得 所以新建用户之后,无法马上引入TFS.查询原因是 Builtin组中没有该账号,以前也总是碰到新加 ...
- 蓝牙BLE数据包格式汇总
以蓝牙4.0为例说明: BLE包格式有:广播包.扫描包.初始化连接包.链路层控制包(LL层数据包).逻辑链路控制和自适应协议数据包(即L2CAP数据包)等: 其中广播包又分为:定向广播包和非定向广播包 ...