• JavaScript 输出


    某些情况下,可能需要将程序的运行结果输出到浏览器中,JavaScript 中为我们提供了多种不同的输出语句来向浏览器中输出内容:

    1. 使用 alert() 函数来弹出提示框;
    2. 使用 confirm() 函数来弹出一个对话框;
    3. 使用 document.write() 方法将内容写入到 HTML 文档中;
    4. 使用 innerHTML 将内容写入到 HTML 标签中;
    5. 使用 console.log() 在浏览器的控制台输出内容。

     alert() 函数

    使用 JS alert() 函数可以在浏览器中弹出一个提示框,在提示框中我们可以定义要输出的内容,语法格式如下:

    alert(message);

    其中 message 为要在提示框中输出的内容,需要注意的是,alert() 中只能输出文本内容。

    alert() 函数是 window 对象下的一个函数,所以有时为了代码更严谨,我们也可以使用 window.alert() 的形式来调用 alert() 函数。

    示例显示一个警示框:

     

    confirm() 函数

    JS confirm() 函数与 alert() 函数相似,它们都是 window 对象下的函数,同样可以在浏览器窗口弹出一个提示框,不同的是,使用 confirm() 函数创建的提示框中,除了包含一个“确定”按钮外,还有一个“取消”按钮。如果点击“确定”按钮,那么 confirm() 函数会返回一个布尔值 true,如果点击“取消”按钮,那么 confirm() 函数会返回一个布尔值 false。

    显示一个确认框,提醒访客点击什么:

    1. function myFunction(){
    2. var x;
    3. var r=confirm("按下按钮!");
    4. if (r==true){
    5. x="你按下了\"确定\"按钮!";
    6. }
    7. else{
    8. x="你按下了\"取消\"按钮!";
    9. }
    10. document.getElementById("demo").innerHTML=x;
    11. }

     

     

    console.log()

    使用 JS console.log() 可以在浏览器的控制台输出信息,我们通常使用 console.log() 来调试程序,其语法格式如下:

    console.log(message);

    其中 message 为要输出的内容,可以是字符串或者对象类型。与 window.alert() 和 window.confirm() 可以分别简写成 alert() 和 confirm() 不同,console.log() 不能简写。

    要看到 console.log() 的输出内容需要先打开浏览器的控制台。以 Chrome 浏览器为例,要打开控制台您只需要在浏览器窗口按 F12 快捷键,或者点击鼠标右键,并在弹出的菜单中选择“检查”选项即可。最后,在打开的控制台中选择“Console”选项,如下图所示:

     

    document.write()

    使用 JS document.write() 可以向 HTML 文档中写入 HTML 或者 JavaScript 代码,语法格式如下:

    document.write(exp1, exp2, exp3, ...);

    其中 exp1、exp2、exp3 为要向文档中写入的内容,document.write() 可以接收多个参数,即我们可以一次向文档中写入多个内容,内容之间使用逗号进行分隔。

    例:

    innerHTML

    与前面介绍的几个函数不同,innerHTML 是一个属性而不是一个函数,通过它可以设置或者获取指定 HTML 标签中的内容,示例代码如下:

    1. "demo">JavaScript 输出
    2. <script type="text/javascript">
    3. var demo = document.getElementById("demo");
    4. console.log(demo.innerHTML);
    5. demo.innerHTML = "

      innerHTML

      "
    6. script>

     

     

  • 相关阅读:
    Vue源码之模板编译浅析
    关系抽取:传统:UniRel: Unified Representation and Interaction for Joint Relational
    1526_AURIX TC275 BootROM下
    HarmonyOS开发环境搭建
    HTTPS 的加密流程
    java毕业设计班导师日常事务管理系统mybatis+源码+调试部署+系统+数据库+lw
    F. Quests Codeforces Round #835 (Div. 4)(二分答案)
    linux平台源码编译ffmpeg
    包装类型、自动装箱与拆箱的原理、装箱拆箱的发生时机、包装类型的常量池技术、包装类型的11个常见判断是否相等的例子
    什么是 BA ?BA怎么样?BA和BI是什么关系?
  • 原文地址:https://blog.csdn.net/BambooStrip/article/details/126820765