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

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>
赞 (0)

相关推荐

  • JavaScript实现防止网页被嵌入Frame框架的代码分享

    最近,国内开始流行另一种流氓行为:使用框架(Frame),将你的网页嵌入它的网页中. 比如,有一家网站号称自己是"口碑聚合门户",提供全国各个网上论坛的精华内容.但是,其实它就是用框架抓取他人的网页,然后在上面加上自己的广告和站标,这同盗版书商有何不同?! 防止方法,在 复制代码 代码如下: </body> 之前加入这段代码: 复制代码 代码如下: <script type="text/javascript">  if ( top.locat

  • 嵌入式iframe子页面与父页面js通信的方法

    本文实例讲述了嵌入式iframe子页面与父页面js通信的方法.分享给大家供大家参考.具体分析如下: iframe框架中的页面与主页面之间的通信方式根据iframe中src属性是同域链接还是跨域链接,有明显不同的通信方式,同域下的数据交换和DOM元素互访就简单的多了,而跨域的则需要一些巧妙的方式来实现通信. 一.同域下父子页面的通信 父页面 parent.html: 复制代码 代码如下: <html> <head> <script type="text/javascr

  • 在JavaScript里嵌入大量字符串常量的实现方法

    数量少还好,多的话就密密麻麻的一坨文字,讲究美观的文艺青年们,会用大量的字符连接符号甚至加上缩进,强制换成好几行.例如: 复制代码 代码如下: var html =    '<div>' +        '<p>Hello</p>' +        '<p>World'</p>' +    '</div>'; 这还好,要是字符串里有不少双引号单引号,那就更麻烦了,各种转义字符看的眼花缭乱. 其实有个不怎么起眼的小技巧,就能解决这个

  • Javascript基础_嵌入图像的简单实现

    Javascript基础_嵌入图像的简单实现

    img元素允许我们在HTML文档里嵌入图像. 要嵌入一张图像需要使用src和alt属性,代码如下: <img src="../img/example/img-map.jpg" alt="Products Image" width="580" height="266" /> 显示效果: 1 在超链接里嵌入图像 img元素的一个常见用法是结合a元素创建一个基于图像的超链接,代码如下: <a href="

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

    JavaScript 没有任何打印或者输出的函数. 在 HTML 中, JavaScript 通常用于操作 HTML 元素. 操作 HTML 元素 如需从 JavaScript 访问某个 HTML 元素,您可以使用 document.getElementById(id) 方法. 请使用 "id" 属性来标识 HTML 元素,并 innerHTML 来获取或插入元素内容: 实例 <!DOCTYPE html> <html> <body> <h1&

  • JavaScript 装逼指南(js另类写法)

    下面就是具体的写法,建议大家逐个测试一下,加深印象 1.转Boolean类型 这个较为常用. !!'a'//true 通过两个取反,可以强制转换为Boolean类型. !!是将表达式强制转化为bool值的运算,运算结果为true或false,表达式是什么值,结果就是对应的bool值,不再取非. 不是取非再取非的意思!!! !!false=false;    要注意false和"false" 的区别!!!!! !!"false"=true; !!true=true;

  • javascript模拟map输出与去除重复项的方法

    本文实例讲述了javascript模拟map输出与去除重复项的方法.分享给大家供大家参考.具体方法如下: 1.Javascriptmap输出 function Map(){ // private var obj = {} ;// 空的对象容器,承装键值对 // put 方法 this.put = function(key , value){ obj[key] = value ;// 把键值对绑定到obj对象上 } // size 方法 获得map容器的个数 this.size = functio

  • 用javascript实现自动输出网页文本

    用javascript实现自动输出网页文本,用了setTimeout(),递归和String.substring();两个函数实现此功能,下面把实现代码分享给大家. 做出的效果就像是有一个打字员在打字. <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content=&q

  • JavaScript定义及输出螺旋矩阵的方法详解

    JavaScript定义及输出螺旋矩阵的方法详解

    本文实例讲述了JavaScript定义及输出螺旋矩阵的方法.分享给大家供大家参考,具体如下: 昨晚无意看到这样一个算法题目,然后就想着用js来实现. 昨晚草草写完后感觉代码很丑,很臭,于是今晚又花点时间重构了一下,感觉变得优雅了. 什么是螺旋矩阵 螺旋矩阵是指一个呈螺旋状的矩阵,它的数字由第一行开始到右边不断变大,向下变大,向左变大,向上变大,如此循环. 如图: 实现效果 实现代码 (function() { var map = (function() { function map(n) { t

  • javaScript 实现重复输出给定的字符串的常用方法小结

    本文实例讲述了javaScript 实现重复输出给定的字符串的常用方法.分享给大家供大家参考,具体如下: 实现功能:重复输出字符串 (重要的事情说3遍)   重复一个指定的字符串 num次,如果num是一个负数则返回一个空字符串. 方法1:for循环重复输出 function repeat(str, num) { if(num > 0) { var repeatStr = ""; for (var i = 0; i < num; i++) { repeatStr += st

  • JavaScript 中的输出数据多种方式

    JavaScript 中的输出数据多种方式

    前言 在 JavaScript 中,不像 Java 等语言,它没有任何打印或者输出方法的,通常使用如下 4 种方式来输出数据. 使用 window.alert() 用于弹出警告框 使用 document.write() 将内容写入到 HTML 文档中 使用 innerHTML 写入到 HTML 元素 使用 console.log() 写入到浏览器的控制台 以下分别使用它们来展示一个实例. window.alert() 新建一个 HTML 文件,然后用 VSCode 写入如下代码. <!DOCTY

  • JavaScript的Vue.js库入门学习教程

    JavaScript的Vue.js库入门学习教程

    Vue是一个小巧轻便的javascript库.它有一个简单易懂的API,能够让开发者在开发web应用的时候更加简易便捷.实际上,一直让Vue引以为豪的是它的便捷性.执行力.灵活性. 这篇教程的目的就是通过一些例子,让你能够概览一些基本的概念和特性.在接下来的其他教程里,你会学到Vue更多的有用的特性,从而用Vue搭建一个可扩展的项目. MVVM 数据绑定 MVVM的本质是通过数据绑定链接View和Model,让数据的变化自动映射为视图的更新.Vue.js在数据绑定的API设计上借鉴了Angula

  • JavaScript创建命名空间的5种写法

    在JavaScript中全局变量经常会引起命名冲突,甚至有时侯重写变量也不是按照你想像中的顺序来的,可以看看下面的例子: 复制代码 代码如下: var sayHello = function() {   return 'Hello var'; }; function sayHello(name) {   return 'Hello function'; }; sayHello(); 最终的输出为 复制代码 代码如下: > "Hello var" 为什么会这样,根据 StackOv

  • Javascript模块化编程(一)模块的写法最佳实践

    Javascript模块化编程(一)模块的写法最佳实践

    随着网站逐渐变成"互联网应用程序",嵌入网页的Javascript代码越来越庞大,越来越复杂.  网页越来越像桌面程序,需要一个团队分工协作.进度管理.单元测试等等......开发者不得不使用软件工程的方法,管理网页的业务逻辑. Javascript模块化编程,已经成为一个迫切的需求.理想情况下,开发者只需要实现核心的业务逻辑,其他都可以加载别人已经写好的模块. 但是,Javascript不是一种模块化编程语言,它不支持"类"(class),更遑论"模块&

随机推荐