HTML文档内嵌入JS方法汇总

这次给大家带来HTML文档内嵌入JS方法汇总,HTML文档内嵌入JS的注意事项有哪些,下面就是实战案例,一起来看一下。

在HTML里嵌入JavaScript

在HTML文档里嵌入客户端JavaScript代码有4中方法:

1.内嵌,放置在和标签之间  (少);

2.放置在有标签的src属性指定的外部文件中 (多);

3.放置自HTML事件处理程序中,该事件处理程序由onclick或onmouseover这样的HTML属性值指定它  (很少);

4.放在一个URL里,这个URL使用特殊的协议”javascript“协议  (很少);

0——附:脚本类型

JavaScript是Web的原始脚本语言,在默认情况下,元素包含或引用JavaScript代码。如果要使用不标准的脚本语言,如VBScript,就必须用type属性指定脚本的MIME类型,例如:

  ... ... 

登录后复制

type 属性的默认值是 ”text/javascript“。

1——内嵌元素

例如:

   function displayTime(){  ... ...  }  window.onload = displayTime; 

登录后复制

2——src属性使用外部文件中的脚本

标签支持src属性,这个属性指定包含JavaScript代码的文件的URL。它的用法如下:

复制代码 代码如下:

使用src属性时,标签之间的任何内容都会被忽略。

当在页面中用src属性包含一个脚本时,就给了脚本坐着完全控制Web页面的权限。

3——HTML中的事件处理程序

当脚本所在的HTML文件被载入浏览器时,这个脚本里的JavaScript代码只会执行一次。JavaScript代码可以通过把函数赋值给Element对象的属性来注册事件处理程序。这个Element对象表示文档里的一个HTML元素。

例如:

复制代码 代码如下:

HTML中定义的事件处理程序的属性可以包含任意条JavaScript语句,相互之间用逗号分隔。这些语句组成一个函数体,然后这个函数成为对应事件处理程序属性的值。

4——URL中JavaScript

在URL后面跟着一个javascript:协议限定符,是另一种嵌入JavaScript代码到客户端的方式。这种特殊的协议类型指定URL内容为任意字符串,这个字符串是会被JavaScript解释器运行的JavaScript代码。它被当作单独的一行代码对待,这意味着语句之间必须用分号隔开,而注释必须用/**/注释代替。javascript:URL能识别的资源是转换成字符串的执行代码的返回值。如果代码返回 undefined,那么这个资源是没有内容的。

javascript:URL可以在可以使用常规URL的任意地方:比如标记的href属性,

超链接里的JavaScript URL可以是这样:

 What time is it? 

登录后复制

相信看了本文案例你已经掌握了方法,更多精彩请关注【创想鸟】其它相关文章!

推荐阅读:

怎样使用Vue实现树形视图数据

怎样使用V-Distpicker组件

以上就是HTML文档内嵌入JS方法汇总的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2753022.html

(0)
上一篇 2025年3月8日 06:32:33
下一篇 2025年3月8日 06:32:44

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • Javascript 编码约定(编码规范)

    这篇文章主要介绍了javascript 编码约定(编码规范),需要的朋友可以参考下 1、使用 strict 模式 在一个作用域(包括函数作用域、全局作用域)中,可以使用 “use strict”; 来开启 stric…

    编程技术 2025年3月8日
    000
  • JavaScript获取移动设备型号的实现代码(JS获取手机型号和系统)

    这篇文章主要介绍了javascript获取移动设备型号的实现代码,需要的朋友可以参考下 我们一般在浏览器里识别用户的访问设备都是通过 User Agent 这个字段来获取的,但是通过它我们只能获取一个大概的信息,比如你用的是 Mac 还是 …

    编程技术 2025年3月8日
    200
  • 详解JS常见的BUG和错误处理

    这次给大家带来详解JS常见的BUG和错误处理,详JS常见BUG和错误处理的注意事项有哪些,下面就是实战案例,一起来看一下。 计算机程序中的缺陷通常称为 bug。 它让程序员觉得很好,将它们想象成小事,只是碰巧进入我们的作品。 实际上,当然,…

    编程技术 2025年3月8日
    200
  • js经验分享 JavaScript反调试技巧

    在这篇文章中,我打算跟大家总结一下关于javascript反调试技巧方面的内容。值得一提的是,其中有些方法已经被网络犯罪分子广泛应用到恶意软件之中了,需要的朋友可以参考下 在此之前,我一直都在研究JavaScript相关的反调试技巧。但是当…

    2025年3月8日
    200
  • JS内this指向使用实例详解

    这次给大家带来JS内this指向使用实例详解,JS内this指向使用的注意事项有哪些,下面就是实战案例,一起来看一下。 在具体的实际应用中,this 的指向无法在函数定义时确定,而是在函数执行的时候才确定的,根据执行时的环境大致可以分为以下…

    编程技术 2025年3月8日
    200
  • JS加载方式使用汇总

    这次给大家带来JS加载方式使用汇总,JS加载方式使用的注意事项有哪些,下面就是实战案例,一起来看一下。 一:同步加载 我们平时使用的最多的一种方式。 同步模式,又称阻塞模式,会阻止浏览器的后续处理,停止后续的解析,只有当当前加载完成,才能进…

    编程技术 2025年3月8日
    200
  • 如何操作JS生成指随机数与随机序列

    这次给大家带来如何操作JS生成指随机数与随机序列,JS生成指随机数与随机序列的注意事项有哪些,下面就是实战案例,一起来看一下。 在JavaScript中我们经常使用Math.random()方法生成随机数,但是该方法生成的随机数只是0-1之…

    编程技术 2025年3月8日
    200
  • 怎样操作JS文件内加载jquery.js(附代码)

    这次给大家带来怎样操作JS文件内加载jquery.js(附代码),操作JS文件内加载jquery.js的注意事项有哪些,下面就是实战案例,一起来看一下。 最近有一个需求: 1.在一个html中只能引入一个JS文件 不能有JS代码和其他JS文…

    2025年3月8日
    200
  • 关于js的三种使用方式案例详解(附代码)

    这次给大家带来关于js的三种使用方式案例详解(附代码),js的三种使用方式的注意事项有哪些,下面就是实战案例,一起来看一下。 1、行内js:js不单独写出 js使用方式1:行内js 登录后复制 2、内部js:script里的程序整个页面都可…

    编程技术 2025年3月8日
    200
  • 利用node.js对webpack打包

    本篇文章主要介绍了webpack打包node.js后端项目的方法,现在分享给大家,也给大家做个参考。 本文介绍了webpack打包node.js后端项目的方法,分享给大家,具体如下: 安装依赖 npm install –save-dev …

    编程技术 2025年3月8日
    200

发表回复

登录后才能评论