JavaScript基本的输出和嵌入式写法教程


Posted in Javascript onOctober 20, 2015

JavaScript 没有任何打印或者输出的函数。
在 HTML 中, JavaScript 通常用于操作 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 = "Paragraph changed." 是用于修改元素的 HTML 内容(innerHTML)的 JavaScript 代码。

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

<!DOCTYPE html>
<html>
<body>

<h1>我的第一个 Web 页面</h1>

<p>我的第一个段落。</p>

<script>
document.write(Date());
</script>

</body>
</html>

请使用 document.write() 仅仅向文档输出写内容。
如果在文档已完成加载后执行 document.write,整个 HTML 页面将被覆盖。
实例

<!DOCTYPE html>
<html>
<body>

<h1>我的第一个 Web 页面</h1>

<p>我的第一个段落。</p>

<button onclick="myFunction()">点我</button>

<script>
function myFunction() {
document.write(Date());
}
</script>

</body>
</html>

写到控制台
如果您的浏览器支持调试,你可以使用 console.log() 方法在浏览器中显示 JavaScript 值。
浏览器中使用 F12 来启用调试模式, 在调试窗口中点击 "Console" 菜单。
实例

<!DOCTYPE html>
<html>
<body>

<h1>我的第一个 Web 页面</h1>

<script>
a = 5;
b = 6;
c = a + b;
console.log(c);
</script>

</body>
</html>
Javascript 相关文章推荐
Jquery中children与find之间的区别详细解析
Nov 29 Javascript
简介JavaScript中Math.cos()余弦方法的使用
Jun 15 Javascript
微信小程序 数据绑定详解及实例
Oct 25 Javascript
JS实现根据用户输入分钟进行倒计时功能
Nov 14 Javascript
如何获取元素的最终background-color
Feb 06 Javascript
Bootstrap表单使用方法详解
Feb 17 Javascript
如何使用vuejs实现更好的Form validation?
Apr 07 Javascript
Angular实现点击按钮控制隐藏和显示功能示例
Dec 29 Javascript
小程序实现订单倒计时功能
Apr 23 Javascript
js实现简单分页导航栏效果
Jun 28 Javascript
详解vuejs中执行npm run dev出现页面cannot GET/问题
Apr 26 Javascript
如何使用原生Js实现随机点名详解
Jan 06 Javascript
javascript省市级联功能实现方法实例详解
Oct 20 #Javascript
基于JavaScript实现移动端TAB触屏切换效果
Oct 20 #Javascript
js点击文本框后才加载验证码实例代码
Oct 20 #Javascript
javascript实现状态栏中文字动态显示的方法
Oct 20 #Javascript
基于jQuery实现的扇形定时器附源码下载
Oct 20 #Javascript
JS实现仿Windows经典风格的选项卡Tab切换代码
Oct 20 #Javascript
JavaScript实现的简单烟花特效代码
Oct 20 #Javascript
You might like
jq的get传参数在utf-8中乱码问题的解决php版
2008/07/23 PHP
sphinx增量索引的一个问题
2011/06/14 PHP
解析PHP留言本模块主要功能的函数说明(代码可实现)
2013/06/25 PHP
php GUID生成函数和类
2014/03/10 PHP
深入理解PHP中的global
2014/08/19 PHP
php实现图片缩略图的方法
2016/03/29 PHP
php解决crontab定时任务不能写入文件问题的方法分析
2019/09/16 PHP
理解JavaScript的caller,callee,call,apply
2009/04/28 Javascript
基于jquery固定于顶部的导航响应浏览器滚动条事件
2014/11/02 Javascript
详解jquery中$.ajax方法提交表单
2014/11/03 Javascript
Javascript 正则表达式实现为数字添加千位分隔符
2015/03/10 Javascript
jQuery实现提交按钮点击后变成正在处理字样并禁止点击的方法
2015/03/24 Javascript
js判断文件格式及大小的简单实例(必看)
2016/10/11 Javascript
JS中Array数组学习总结
2017/01/18 Javascript
基于Node的React图片上传组件实现实例代码
2017/05/10 Javascript
自定义事件解决重复请求BUG的问题
2017/07/11 Javascript
详解angularjs获取元素以及angular.element()用法
2017/07/25 Javascript
JS生成随机打乱数组的方法示例
2017/12/23 Javascript
vue-router命名路由和编程式路由传参讲解
2019/01/19 Javascript
基于Vue el-autocomplete 实现类似百度搜索框功能
2019/10/25 Javascript
详解Vscode中使用Eslint终极配置大全
2019/11/08 Javascript
解决antd datepicker 获取时间默认少8个小时的问题
2020/10/29 Javascript
[54:02]2018DOTA2亚洲邀请赛 4.1 小组赛 B组 IG vs VGJ.T
2018/04/03 DOTA
[01:50:49]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Aster BO3 第三场 1月24日
2021/03/11 DOTA
深入理解Django中内置的用户认证
2017/10/06 Python
Python使用Selenium模块模拟浏览器抓取斗鱼直播间信息示例
2018/07/18 Python
Python异常处理操作实例详解
2018/08/28 Python
python 实现方阵的对角线遍历示例
2019/11/29 Python
Django数据模型中on_delete使用详解
2020/11/30 Python
如何用用Python将地址标记在地图上
2021/02/07 Python
CSS3弹性盒模型flex box快速入门心得(必看篇)
2016/05/24 HTML / CSS
商场开业庆典策划方案
2014/06/02 职场文书
安全员岗位职责
2015/02/10 职场文书
Innodb存储引擎中的后台线程详解
2022/04/03 MySQL
电脑关机速度很慢怎么办 提升电脑关机速度设置教程
2022/04/08 数码科技
python中 .npy文件的读写操作实例
2022/04/14 Python