锐客网

  1. 首页 > 睿知 > it技术 > >

详解JavaScript实现JS弹窗的三种方式

目录

  • 一、前言
  • 二、什么是JavaScript，有什么用?
  • 三、HTML嵌入JavaScript的方式：
    • 第一种方式：
    • 第二种方式：
    • 第三种方式：
  • 总结

    一、前言 html和css的学习大致完成，我们进入重要的JavaScript学习阶段

    二、什么是JavaScript，有什么用? Javascript是运行在浏览器上的脚本语言。简称JS。
    他的出现让原来静态的页面动起来了，更加的生动。

    三、HTML嵌入JavaScript的方式：
    第一种方式：
    1、要实现的功能:
    用户点击以下按钮，弹出消息框。
    2、弹窗
    JS是一门事件驱动型的编程语言，依靠事件去驱动，然后执行对应的程序。在JS中有很多事件，其中有一个事件叫做:鼠标单击，单词:click。并且任何事件都会对应一个事件句柄叫做:onclick。【注意:事件和事件句柄的区别是:事件句柄是在事件单词前添加一个on。】，而事件句柄是以HTML标签的属性存在的。
    3、οnclick=js代码"，执行原理是什么?
    页面打开的时候，js代码并不会执行，只是把这段ss代码注册到按钮的click事件上了。等这个按钮发生click事件之后，注册在onclick后面的js代码会被浏览器自动调用。
    4、怎么使用JS代码弹出消息框?
    在JS中有一个内置的对象叫做window,全部小写，可以直接拿来使用，window代表的是浏览器对象。window对象有一个函数叫做:alert，用法是:window.alert("消息"); 这样就可以弹窗了。
    5、window.可以省略
    下面两个等价

    6、设置多个alert可以一直弹窗

    JS中的字符串可以使用双引号，也可以使用单引号。JS中的一条语句结束之后可以使用分号"; "也可以不用。
    无分号，内单外双引号 有分号，内双外单引号

    整体代码：
    JavaScript第一种 - 锐客网

    弹窗效果：
    详解JavaScript实现JS弹窗的三种方式
    文章图片


    第二种方式：
    【详解JavaScript实现JS弹窗的三种方式】脚本如：

    • javascript的脚本块在一个页面当中可以出现多次。
    • javascript的脚本块出现位置也没有要求。
    如：
    HTML中嵌入JS代码的第二种方式 - 锐客网

    alert有阻塞当前页面加载的作用。(阻挡，直到用户点击确定按钮。
    在脚本块当中的程序，在页面打开的时候执行并且遵守自上而下的顺序依次逐行执行。(这个代码的执行不需要事件，即运行就开始)

    第三种方式：
    引入外部独立的js文件如，外部文件路径
    HTM中嵌入JS代码的第三种方式:引入外部独立的js文件。 - 锐客网

    在需要的位置引入js脚本文件
    引入外部独立的js文件的时候，js文件中的代码会遵循自上而下的顺序依次逐行执行。
    ①在引入的外部脚本中又加alert，则这个不会生效
    ②需要另外写一个才会生效
    如：
    HTM中嵌入JS代码的第三种方式:引入外部独立的js文件。 - 锐客网


    总结 本篇文章就到这里了，希望能够给你带来帮助，也希望您能够多多关注脚本之家的更多内容!

      推荐阅读


      上一篇：C#任务并行Parellel.For和Parallel.ForEach

      下一篇：js实现音乐播放器