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 相关文章推荐
制作特殊字的脚本
Jun 26 Javascript
javascript replace方法与正则表达式
Feb 19 Javascript
JavaScript中继承的一些示例方法与属性参考
Aug 07 Javascript
判断用户是否在线的代码
Mar 05 Javascript
javascript自定义startWith()和endWith()的两种方法
Nov 11 Javascript
JavaScript中的this,call,apply使用及区别详解
Jan 29 Javascript
JQuery导航菜单选择特效
Apr 11 Javascript
window.open不被拦截的简单实现代码(推荐)
Aug 04 Javascript
浅谈移动端之js touch事件 手势滑动事件
Nov 07 Javascript
详解javascript中的变量提升和函数提升
May 24 Javascript
element实现合并单元格通用方法
Nov 13 Javascript
基于JavaScript实现控制下拉列表
May 08 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
解析php如何将日志写进syslog
2013/06/28 PHP
ThinkPHP视图查询详解
2014/06/30 PHP
使用PHP实现阻止用户上传成人照片或者裸照
2014/12/25 PHP
PHP中error_log()函数的使用方法
2015/01/20 PHP
Javascript开发包大全整理
2006/12/22 Javascript
基于jquery的修改当前TAB显示标题的代码
2010/12/11 Javascript
简单几行JS Code实现IE邮件转发新浪微博
2013/07/03 Javascript
利用JQuery制作符合Web标准的QQ弹出消息
2014/01/14 Javascript
用js一次改变多个input的readonly属性值的方法
2014/06/11 Javascript
js实现的早期滑动门菜单效果代码
2015/08/27 Javascript
基于js对象,操作属性、方法详解
2016/08/11 Javascript
原生JS实现幻灯片
2017/02/22 Javascript
Ext JS 实现建议词模糊动态搜索功能
2017/05/13 Javascript
利用vscode编写vue的简单配置详解
2017/06/17 Javascript
jQuery 1.9版本以上的浏览器判断方法代码分享
2017/08/28 jQuery
详解JS构造函数中this和return
2017/09/16 Javascript
vue、react等单页面项目应该这样子部署到服务器
2018/01/03 Javascript
微信小程序实现红包雨功能
2018/07/11 Javascript
jQuery删除/清空指定元素的所有子节点实例代码
2019/07/04 jQuery
vue-calendar-component 封装多日期选择组件的实例代码
2020/12/04 Vue.js
Python之读取TXT文件的方法小结
2018/04/27 Python
pytorch逐元素比较tensor大小实例
2020/01/03 Python
PyTorch中Tensor的数据统计示例
2020/02/17 Python
解决Jupyter notebook更换主题工具栏被隐藏及添加目录生成插件问题
2020/04/20 Python
Python3.7安装pyaudio教程解析
2020/07/24 Python
Python利用Faiss库实现ANN近邻搜索的方法详解
2020/08/03 Python
意大利一家专营包包和配饰的网上商店:Borse Last Minute
2019/08/26 全球购物
秘书行业自我鉴定范文
2013/12/30 职场文书
八年级历史教学反思
2014/01/10 职场文书
国际商务专业求职信
2014/07/15 职场文书
离婚财产处理协议书
2014/09/30 职场文书
师范生免费教育协议书范本
2014/10/09 职场文书
堂吉诃德读书笔记
2015/06/30 职场文书
详解Nginx 被动检查服务器的存活状态
2021/10/16 Servers
Python函数对象与闭包函数
2022/04/13 Python
mysql性能优化以及配置连接参数设置
2022/05/06 MySQL