JavaScript 没有任何打印或者输出的函数。

㈠JavaScript 显示数据

⑴使用 window.alert() 弹出警告框。

⑵使用 document.write() 方法将内容写到 HTML 文档中。

⑶使用 innerHTML 写入到 HTML 元素。

⑷使用 console.log() 写入到浏览器的控制台。

㈡使用 window.alert()

举例示范如下：

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>警告框</title>

</head>

<body>

<h1>弹出警告框来显示数据</h1>

<p>计算简单的加法运算</p>

<script>

window.alert(5 + 6);

</script>

</body>

</html>

效果图：

 

㈢操作 HTML 元素

如果需要从 JavaScript 访问某个 HTML 元素，可以使用 document.getElementById(id) 方法。

使用 "id" 属性来标识 HTML 元素，并 innerHTML 来获取或插入元素内容：

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>操作HTML元素</title>

</head>

<body>

<h1>静夜思</h1>

<p id="demo">床前明月光</p>

<script>

document.getElementById("demo").innerHTML="段落已修改。";

</script>

</body>

</html>

效果图：

★解析：

以上 JavaScript 语句（在 <script> 标签中）可以在 web 浏览器中执行：

document.getElementById("demo") 是使用 id 属性来查找 HTML 元素的 JavaScript 代码 。

innerHTML = "段落已修改。" 是用于修改元素的 HTML 内容(innerHTML)的 JavaScript 代码。

 

㈣写到 HTML 文档

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>写到 HTML 文档</title>

</head>

<body>

<h1>实时时间</h1>

<p>此时此刻是何年何月何时何分何秒。</p>

<script>

document.write(Date());

</script>

</body>

</html>

效果图:

注意：

使用 document.write() 仅仅向文档输出写内容。

如果在文档已完成加载后执行 document.write，整个 HTML 页面将被覆盖。

 

ps:突然觉得这个时刻神圣，以后再来看的时候也能看到是什么时刻敲下的这行代码，意义重大啊~~~

㈤写到控制台

浏览器中使用 F12 来启用调试模式， 在调试窗口中点击 "Console" 菜单。

<!DOCTYPE html>

<html>

<body>

<h1>在控制台进行呀</h1>

<p>浏览器使用F12来启用调试模式</p>

<script>

a = 5;

b = 6;

c = a + b;

console.log(c);

</script>

</body>

</html>

效果图：

JavaScript 输出的四种方法的更多相关文章

  1. JavaScript确定一个字符串是否包含在另一个字符串中的四种方法

    一.indexOf() 1.定义 indexOf()方法返回String对象第一次出现指定字符串的索引,若未找到指定值,返回-1.(数组同一个概念) 2.语法 str.indexOf(searchVa ...

  2. JavaScript数据类型判断的四种方法

    码文不易啊,转载请带上本文链接呀,感谢感谢 https://www.cnblogs.com/echoyya/p/14416375.html 本文分享了JavaScript类型判断的四种方法:typeo ...

  3. JavaScript数组去重的四种方法

    今天,洗澡的想一个有趣的问题,使用js给数组去重,我想了四种方法,虽然今天的任务没有完成,5555: 不多说,po代码: //方法一:简单循环去重    Array.prototype.unique1 ...

  4. 两个变量交换的四种方法（Java） 七种方法(JS)

    两个变量交换的四种方法(Java)   对于两种变量的交换,我发现四种方法,下面我用Java来演示一下. 1.利用第三个变量交换数值,简单的方法. (代码演示一下) 1 class TestEV 2 ...

  5. 两个变量交换的四种方法（Java）

    对于两种变量的交换,我发现四种方法,下面我用Java来演示一下. 1.利用第三个变量交换数值,简单的方法. (代码演示一下) class TestEV //创建一个类 { public static ...

  6. Javascript函数调用的四种模式

    一 前言 Javascript一共有四种调用模式:方法调用模式.函数调用模式.构造器调用模式以及apply调用模式.调用模式不同,对应的隐藏参数this值也会不同. 二 方法调用模式 函数作为对象的属 ...

  7. PHP读写XML文件的四种方法

    PHP对XML文件进行读写操作的方法一共有四种,分别是:字符串方式直接读写.DOMDocument读写. XMLWrite写和XMLReader读.SimpleXML读写,本文将依次对这四种方法进行介 ...

  8. 解析Xml四种方法

    关键字:Java解析xml.解析xml四种方法.DOM.SAX.JDOM.DOM4j.XPath [引言] 目前在Java中用于解析XML的技术很多,主流的有DOM.SAX.JDOM.DOM4j,下文 ...

  9. java环境变量配置四种方法

    原文:java环境变量配置四种方法 Java编程首要工作就是安装JDK(Java Development Kit).一通“NEXT”点完安装后就是最重要的环境变量设置了.也许有人会问为什么要设置环境变 ...

随机推荐

  1. 谷歌云SSH开启root密码登陆

    废话不多说,开始教程 1.先选择从浏览器打开ssh连接服务器连接登录成功后,输入以下命令 sudo -i #切换到root passwd #修改密码 然后会要求输入新密码,然后再重复一次密码,输入密码 ...

  2. python list 中extend（）与append（）区别

    def changextend(str): "print string with extend" mylist.extend([40,50,60]); print(mylist) ...

  3. 从入门到自闭之python三大器--装饰器进阶

    装饰器的进阶 有参装饰器: # def warpper(func): # def inner(*args,**kwargs): # user = input("user:") # ...

  4. jquery的ajax方法使用application/json出现400错误码的解决方案

    400说明是客户端错误,将contentType默认的application/x-www-form-urlencoded改成application/json就出现错误,说明传输的数据不是JSON. 解 ...

  5. java不同包中protected修饰的属性和方法调用方法

    protected修饰的静态属性和方法的调用方式1:直接类名调用 2:实例化父类对象进行调用 3:实例化子类对象进行调用 protected修饰的非静态属性和方法的调用方式:1:实例化子类对象进行调用 ...

  6. 禁止ios10双指缩放

    document.addEventListener('gesturestart', function(event) { event.preventDefault(); });

  7. Uncaught SyntaxError: Unexpected identifier

    $.ajax({ //请求头 type:"POST", contentType:"application/x-www-form-urlencoded", url ...

  8. Django框架——进阶之AJAX

    <script>$("#b1").on("click", function () { // 点击 id是b1的按钮要做的事儿 var i1 = $( ...

  9. nodejs在Mac下的卸载

    卸载: 在 node 官网上下载的安装包,用安装包安装的node.应该可以用一下命令行卸载: 在终端输入以下命令: sudo rm -rf /usr/local/{bin/{node,npm},lib ...

  10. PropertySource顺序

    Spring Boot使用一个非常特殊的PropertySource顺序,该顺序旨在允许合理地覆盖值.按以下顺序考虑属性: $HOME/.config/spring-boot当devtools处于活动 ...