0

0

html里js怎么使用

coldplay.xixi

coldplay.xixi

发布时间:2021-03-04 14:18:03

|

9566人浏览过

|

来源于php中文网

原创

html里js的使用方法:1、在html中使用【】嵌入javascript,在使用【】包含外部文件时使用src属性;2、所有【】元素都应该放在页面的元素中。

html里js怎么使用

本教程操作环境:windows7系统、html 4.01版,DELL G3电脑。

html里js的使用方法:

1、<script>元素</script>

在HTML中使用<script></script>嵌入JavaScript

立即学习前端免费学习笔记(深入)”;

HTML 4.01 为

<script></script>定义了下列 6 个属性。

  • async:可选。表示应该立即下载脚本,但不应妨碍页面中的其他操作,比如下载其他资源或等待加载其他脚本。只对外部脚本文件有效。

  • charset:可选。表示通过src属性指定的代码的字符集。由于大多数浏览器会忽略它的值,因此这个属性很少有人用。

  • defer:可选。表示脚本可以延迟到文档完全被解析和显示之后再行。只对外部脚本文件有效。IE7及更早版本对嵌入脚本也支持这个属性。

  • language:已废弃。原来用于表示编写代码使用的脚本语言(如 JavaScript、JavaScript1.2或 VBScript)。大多数浏览器会忽略这个属性,因此也没有必要再用了。

  • src:可选。表示包含要执行代码的外部文件。

  • type:可选。可以看成是language的替代属性;表示编写代码使用的脚本语言的内容类型(也称为 MIME 类型)。虽然 text/javascript 和 text/ecmascript 都已经不被推荐使用,但人们一直以来使用的都还是 text/javascript。实际上,服务器在传送 JavaScript 文件时使用的

MIME 类型通常是 application/x–javascript,但在type中设置这个却可能导致脚本被忽略。另外,在非IE浏览器中还可以使用以下值:

application/javascript和application/ecmascript。考虑到约定俗成和最大限度的浏览器兼容性,目前 type 属性的值依旧还是

text/javascript。不过,这个属性并不是必需的,如果没有指定这个属性,则其默认值仍为text/javascript。

使用<script></script>元素的方式有两种:直接在页面中嵌入 JavaScript 代码和包含外部 JavaScript文件。在使用<script></script>元素嵌入JavaScript代码时,只须为<script></script>指定type属性。然后,像下面这样把JavaScript代码直接放在元素内部即可:

<script type="text/javascript">
function fun(){
    alert("hello")
}
</script>

包含在<script>元素内部的 JavaScript 代码将被从上至下依次解释。</script>

SeoShop
SeoShop

SeoShop网店系统全站纯静态html生成更符合搜索引擎优化,并修改了以前许多js代码,取消了连接地址的js代码更换为纯div+css格式,并且所有文件可自定义url和文件名,自定义内部连接,自定义外部连接,等多个符合SEO搜索引擎优化的设置,让您的网店更容易让搜索引擎收录. 简单易用 极速网店真正做到以人为本、以用户体验为中心,能使您快速搭建网上购物网站。后台管理操作简单,一目了然,没有夹杂多

下载

在解释器对<script>元素内部的所</script>

有代码求值完毕以前,页面中的其余内容都不会被浏览器加载或显示。

在使用<script>嵌入 JavaScript 代码时,记住不要在代码中的任何地方出现</script>字符串。如果必须出现,请使用/转义符

在使用<script>包含外部文件时使用src属性。在解析外部文件时(包括下载)会停止页面的处理。在带有src属性的<script>中间不能再嵌入其他代码 ,否则不会执行。</script>

2、标签的位置

按照传统的做法,所有<script>元素都应该放在页面的元素中,如:</script>

这样做或是浏览器在所有的js文件都下载解析和执行完成后才开始显示页面(浏览器遇到body才会开始呈现内容)

为了避免这个问题,现代 Web 应用程序一般都把全部 JavaScript 引

用放在元素中页面内容的后面,如下例所示:

<!DOCTYPE html>
<html>
<head>
<title>Example HTML Page</title>
</head>
<body>
<!-- 这里放内容 -->
<script type="text/javascript" src="example1.js"></script>
<script type="text/javascript" src="example2.js"></script>
</body>
</html>

这样,在解析包含的JavaScript代码之前,页面的内容将完全呈现在浏览器中。而用户也会因为浏览器窗口显示空白页面的时间缩短而感到打开页面的速度加快了。

3、文档模式

doctype

混杂模式

标准模式

准标准模式

4、

这个元素可以包含能够出现在文档

中的任何 HTML 元素——<script>元素除外。包含<p>在<code><noscript>元素中的内容只有在下列情况下才会显示出来:<p>[ ] 浏览器不支持脚本;<p>[ ] 浏览器支持脚本,但脚本被禁用。<p>符合上述任何一个条件,浏览器都会显示<noscript>中的内容。而在除此之外的其他情况下,浏览器不会呈现<noscript>中的内容。示例:<pre class="brush:php;toolbar:false">&lt;html&gt; &lt;head&gt; &lt;title&gt;Example HTML Page&lt;/title&gt; &lt;script type=&quot;text/javascript&quot; defer=&quot;defer&quot; src=&quot;example1.js&quot;&gt;&lt;/script&gt; &lt;script type=&quot;text/javascript&quot; defer=&quot;defer&quot; src=&quot;example2.js&quot;&gt;&lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;noscript&gt; &lt;p&gt;本页面需要浏览器支持(启用) JavaScript。&lt;/p&gt; &lt;/noscript&gt; &lt;/body&gt; &lt;/html&gt;</pre><blockquote><p>相关学习推荐:<a href="https://www.php.cn/course/list/11.html" target="_blank">html视频教程 </script>

相关文章

HTML速学教程(入门课程)
HTML速学教程(入门课程)

HTML怎么学习?HTML怎么入门?HTML在哪学?HTML怎么学才快?不用担心,这里为大家提供了HTML速学教程(入门课程),有需要的小伙伴保存下载就能学习啦!

下载

相关标签:

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
pixiv网页版官网登录与阅读指南_pixiv官网直达入口与在线访问方法
pixiv网页版官网登录与阅读指南_pixiv官网直达入口与在线访问方法

本专题系统整理pixiv网页版官网入口及登录访问方式,涵盖官网登录页面直达路径、在线阅读入口及快速进入方法说明,帮助用户高效找到pixiv官方网站,实现便捷、安全的网页端浏览与账号登录体验。

463

2026.02.13

微博网页版主页入口与登录指南_官方网页端快速访问方法
微博网页版主页入口与登录指南_官方网页端快速访问方法

本专题系统整理微博网页版官方入口及网页端登录方式,涵盖首页直达地址、账号登录流程与常见访问问题说明,帮助用户快速找到微博官网主页,实现便捷、安全的网页端登录与内容浏览体验。

135

2026.02.13

Flutter跨平台开发与状态管理实战
Flutter跨平台开发与状态管理实战

本专题围绕Flutter框架展开,系统讲解跨平台UI构建原理与状态管理方案。内容涵盖Widget生命周期、路由管理、Provider与Bloc状态管理模式、网络请求封装及性能优化技巧。通过实战项目演示,帮助开发者构建流畅、可维护的跨平台移动应用。

64

2026.02.13

TypeScript工程化开发与Vite构建优化实践
TypeScript工程化开发与Vite构建优化实践

本专题面向前端开发者,深入讲解 TypeScript 类型系统与大型项目结构设计方法,并结合 Vite 构建工具优化前端工程化流程。内容包括模块化设计、类型声明管理、代码分割、热更新原理以及构建性能调优。通过完整项目示例,帮助开发者提升代码可维护性与开发效率。

20

2026.02.13

Redis高可用架构与分布式缓存实战
Redis高可用架构与分布式缓存实战

本专题围绕 Redis 在高并发系统中的应用展开,系统讲解主从复制、哨兵机制、Cluster 集群模式及数据分片原理。内容涵盖缓存穿透与雪崩解决方案、分布式锁实现、热点数据优化及持久化策略。通过真实业务场景演示,帮助开发者构建高可用、可扩展的分布式缓存系统。

26

2026.02.13

c语言 数据类型
c语言 数据类型

本专题整合了c语言数据类型相关内容,阅读专题下面的文章了解更多详细内容。

29

2026.02.12

雨课堂网页版登录入口与使用指南_官方在线教学平台访问方法
雨课堂网页版登录入口与使用指南_官方在线教学平台访问方法

本专题系统整理雨课堂网页版官方入口及在线登录方式,涵盖账号登录流程、官方直连入口及平台访问方法说明,帮助师生用户快速进入雨课堂在线教学平台,实现便捷、高效的课程学习与教学管理体验。

14

2026.02.12

豆包AI网页版入口与智能创作指南_官方在线写作与图片生成使用方法
豆包AI网页版入口与智能创作指南_官方在线写作与图片生成使用方法

本专题汇总豆包AI官方网页版入口及在线使用方式,涵盖智能写作工具、图片生成体验入口和官网登录方法,帮助用户快速直达豆包AI平台,高效完成文本创作与AI生图任务,实现便捷智能创作体验。

524

2026.02.12

PostgreSQL性能优化与索引调优实战
PostgreSQL性能优化与索引调优实战

本专题面向后端开发与数据库工程师,深入讲解 PostgreSQL 查询优化原理与索引机制。内容包括执行计划分析、常见索引类型对比、慢查询优化策略、事务隔离级别以及高并发场景下的性能调优技巧。通过实战案例解析,帮助开发者提升数据库响应速度与系统稳定性。

53

2026.02.12

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
Bootstrap 5教程
Bootstrap 5教程

共46课时 | 3.4万人学习

AngularJS教程
AngularJS教程

共24课时 | 3.7万人学习

CSS教程
CSS教程

共754课时 | 32.8万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号