JavaScript应该被放在什么位置

2023-11-01


1、JavaScript被放在<head></head>中

      首先我们要知道的是HTML  文档加载顺序是从上至下被加载的,而且加载途中遇到JavaScript的代码时就会把JavaScript的代码放入缓冲中,当浏览器找到与它相关的标签时才进行匹配。当我们把JavaScript的代码放在head中的时候,JavaScript的代码就会首先被加载,但是当JavaScript要操作的HTML还没有被加载出来的时候就会报错。所以就有了下面的这种方法。

2、JavaScript被放在<body></body>中

     JavaScript放在<body></body>中,并不是放在任何位置,为了避免上面所说的那种错误,我们把JavaScript放在body的最后面,这样当HTML元素被加载完成了以后才会加载JavaScript的代码,代码如下:

<html>
<head>
</head>
<body>
</body>
<div id="test"></div>
<script type="text/javascript">
document.getElementById("test").innerHTML="测试文字";
</script>
</html

3、外部引用JavaScript代码

      还有一种方法就是外部引用JavaScript的代码,这样既有有点也有缺点。当JavaScript被放在外部的时候,这个时候HTML页面就会更加整洁,体积更小,方便搜索引擎收录。但是也有缺点,当JavaScript代码被放在外面的时候,会增加服务器的http请求负担。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

JavaScript应该被放在什么位置 的相关文章

  • .push() 将多个对象放入 JavaScript 数组中返回“未定义”

    当我将项目添加到beats数组然后console log用户时 我得到了数组中正确的项目数 但是当我检查 length 时 我总是得到 1 尝试调用索引总是会给我 未定义 如下所示 Tom beats 1 我想我错过了一些明显的东西 但这让
  • 滚动时的 CSS 背景模糊

    我有固定的背景图像 滚动时我希望图像变得模糊 我知道如何在 css 中进行模糊 但在特定的滚动位置进行 这是一个例子 https medium com good music f160ba9e6c52 https medium com goo
  • 如何在React Native Android中获取响应头?

    您好 我想在获取 POST 请求后获取响应标头 我尝试调试看看里面有什么response with console log response 我可以从以下位置获取响应机构responseData但我不知道如何获取标题 我想同时获得标题和正文
  • 删除 IE9 边缘周围的 2px 灰色边框

    我正在尝试对这个网站进行编码 尝试关键字 并且我正在尝试找出如何删除这个阴影2px灰色边框延伸到 IE9 窗口的内部 至少顶部 左侧和底部 我的边距设置为零 因此所有页面元素都到达页面的最边缘 但使用 IE9 它们会停在这个灰色边框处 我没
  • javascript 选择自定义光标 (svg)

    我正在动态地将光标更改为悬停时的本地 svg element on mouseover function this css cursor url svgs pointer svg 9 30 auto 工作正常 但我想选择该 svg 来操纵其
  • 如何在另一个自定义 Hook 中使用返回值的自定义 Hook?

    我正在使用 React native 其中有一个名为的自定义 HookuseUser使用以下方法从 AWS Amplify 获取用户信息Auth getUserInfro方法 然后获取返回对象的一部分并用它设置一个状态变量 我还有另一个名为
  • 如何始终将焦点保持在文本框中

    我创建了一个包含两个 div 的 HTML 页面 左侧的 div 页面的 90 是 ajax 结果的目标 右侧的 div 页面的 10 包含一个文本框 该页面的想法是在文本框中输入零件编号 通过条形码扫描仪 并显示与该零件编号匹配的绘图 显
  • 如何计算特定字符在字符串中出现的次数

    我正在尝试创建一个函数来查看数组中的任何字符是否在字符串中 如果是 有多少个 我尝试计算每一种模式 但是太多了 我尝试使用 Python 中的 in 运算符的替代方案 但效果不佳 function calc fit element var
  • 改变 JavaScript 中的顶部填充

    以下是我在 css 中设置顶部填充的方法 body font size font size px margin 0 padding 100px 0 20px 0 width 100 important 如何使用最简单的 javascript
  • 聆听 Angular 2 中的元素可见性

    我正在为我的网络应用程序使用 Bootstrap 和 Angular 2 v4 我想监听指令中的元素以了解可见性变化 我的元素有一个可以隐藏其子元素的父元素hidden sm up我需要在每次隐藏或显示时触发一个函数 div hidden
  • 如何使用 JavaScript 或 jQuery 克隆 HTML 元素的样式对象?

    我正在尝试克隆元素的样式对象 这应该允许我在更改后重置所述元素的样式 例如 el style left 50px curr style left 50px Modify the elements style The cloned style
  • Rails 3.1+ 的 Jasmine 与 Mocha JavaScript 测试 [已关闭]

    Closed 这个问题是基于意见的 help closed questions 目前不接受答案 我对茉莉花有经验并且非常喜欢它 有谁有 Jasmine 和 Mocha 的经验 特别是 Rails 的经验吗 我想知道是否值得转用 我已经在 J
  • 使用 CSS 折叠和展开元素

    我正在尝试构建一个页面 加载时仅可见标题 并且 当用户单击标题时 每个标题下方的表格会在隐藏和显示状态之间切换 我的限制是只能在 CSS 中执行此操作 这是我到目前为止想到的 https jsfiddle net Argoron c1ypx
  • 从 PHP 数组生成 HTML 表

    我不明白这一点 我需要解决看似简单的问题 但这超出了我的逻辑 我需要编写一个函数 table columns input cols 它将输出一个表 示例 input array apple orange monkey potato chee
  • 使用 Enzyme 测试 `React.createRef` api

    我想测试下面的类 它使用React createRef api 不过 快速搜索并没有发现任何这样做的例子 有人成功过吗 我该如何嘲笑裁判 理想情况下我想使用shallow class Main extends React Component
  • 有没有办法使用 ko.observableArray 作为地图?

    有没有办法使用ko observableArray http knockoutjs com documentation observableArrays html像地图 字典一样 例如 var arr ko observableArray
  • 在 iOS 7 Safari 中,如何区分通过边缘滑动与后退/前进按钮的 popstate 事件?

    在 iOS 7 Safari 中 现在有两种后退 前进导航方式 使用底部的传统后退 前进按钮箭头或从屏幕边缘滑动 我正在使用动画在 ajax 应用程序中的页面之间进行转换 但如果用户通过边缘滑动进行导航 我不想触发该转换 因为这本身就是一个
  • 如何从 json 文件创建模型? (ExtJS)

    这是我想使用 json 文件创建的模型 Ext define Users extend Ext data Model fields name user id type int name user name type string 为了根据服
  • 将数组从 jquery ajax 传递到代码后面

    我必须将二维数组传递给在asp net网页代码后面编写的页面方法我有一个变量objList作为二维数组 我使用以下代码来实现此目的 但没有成功 并且未调用页面方法 脚本语言 function BindTable objList ajax u
  • 没有输入的 jQuery 日期选择器

    我有一个相当复杂的网络应用程序 我想向其中添加一些日期选择 UI 我遇到的问题是我无法从文档中弄清楚如何真正控制日期选择器的出现方式和时间 不涉及任何表单元素 不 我不会添加秘密表单字段 因此简单的开箱即用方法根本行不通 我希望有人可以提供

随机推荐

  • thymeleaf 引入js css

    http www cnblogs com suncj p 4028768 html 我一般 都是
  • Nginx安装部署学习

    什么是Nginx Nginx engine x 是一个高性能的HTTP和反向代理web服务器 同时也提供了IMAP POP3 SMTP服务 其特点是占有内存少 并发能力强 协议 BSD like Nginx 安装 1 部署执行命令 apt
  • phpstorm部署sftp的root path跟mappings的问题

    在部署phpstorm的sftp时要注意root path的设置 例如如果想要将本地的 var www目录映射到服务器上的 var www目录 那么如果你的root path为 var www 然后mappings里面的server pat
  • C/C++基本数据类型

    学了 C 然后 C 然后 MFC Windows 然后是 C 其中数据类型很多 由基本类型衍生的 typedef 类型也 N 多 熟知基本数据类型是我们正确表达实际问题中各种数据的前提 因此我分类总结了一下 C C Windows C 基本
  • 信管备考脑图

    参考网址 https zhuanlan zhihu com p 97968103 参考教材 1 信息化与信息系统
  • 中职网络安全2022年赛题Windows(SMB服务漏洞结合NTLM中继进行渗透测试)解析

    文章目录 目录 一 赛题 二 解析 一 赛题 二 解析 任务实施 P066 综合渗透测试 使用SMB服务漏洞结合NTLM中继进行渗透测试 实验环境说明 渗透机 p10 kali 6 1 Kali Linux 用户名 root 密码 toor
  • 使用git强行切换分支

    两行代码轻松搞定 git status 一下 一堆文件为暂存的 git clean dfx 可以直接全部干掉它门 然后git checkout v2 0 切换到2 0分支去 git clean dfx public vue static j
  • Python 导入模块的3种方式

    回到顶部 一 定义 模块就是用一堆的代码实现了一些功能的代码的集合 通常一个或者多个函数写在一个 py文件里 而如果有些功能实现起来很复杂 那么就需要创建n个 py文件 这n个 py文件的集合就是模块 如果不懂可以先看下面这篇博文 http
  • Markdown基础教程

    1 标题 Markdown支持6级标题 一级标题 二级标题 三级标题 四级标题 五级标题 六级标题 标题的效果 一级标题 二级标题 三级标题 四级标题 五级标题 六级标题 2 段落及区块引用 Markdown提供了一个特殊符号 gt 用于段
  • 网红表白弹窗

    如何使用Python表白 先看效果图 一 具体步骤 1 首先我们要安装tkinter库 pip install tkinter 等待安装完成即可 2 使用步骤引入库 from tkinter import from tkinter impo
  • 配置MAC刷新ARP功能

    在以太网中 MAC地址表项用于指导设备进行二层数据转发 ARP表项通过IP地址和MAC地址的映射指导设备进行不同网段间的通信 MAC地址表项的出接口通过报文触发刷新的 ARP表项的出接口是在老化时间到后通过老化探测进行刷新的 这样就可能会出
  • 显著性检验【t-test、方差分析、ks检验】

    显著性检验 t test 方差分析 ks检验 0 目录 1显著性检验基本定义 what 2 使用显著性检验的意义 why 3 显著性检验的具体操作流程 how 1 显著性检验基本定义 统计假设检验 Statistical hypothesi
  • vue 按需引入 element-ui 组件

    新建 plugins element ui js 文件 在里面写入需要引入的组件 import Vue from vue import Button Dialog Form FormItem Loading Message Paginati
  • java char判断相等_java面试题-基础

    1 一个 java 源文件中是否可以包括多个类 不是内部类 有什么限制 可以有多个类 但只能有一个public的类 并且public的类名必须与文件名相一致 2 Java有没有goto java中的保留字 现在没有在java中使用 3 说说
  • 搭建: canal部署与实例运行

    1 准备 github https github com alibaba canal 里面有包括canal的文档 server端 client端的 例子 源码包等等 2 canal概述 canal是应阿里巴巴存在杭州和美国的双机房部署 存在
  • Adobe XD 连不上网用不了插件的解决办法

    安装了xd想用插件发现 提示 请先链接网络 只要注册一个所在地在美国的账号即可联网成功 操作如下 1 依次点击菜单栏帮助 登录 2 点击创建账户 3 输入邮箱和密码 邮箱可以随便输入 但要记住密码方便后期登录 但如果后期忘记了密码可以通过邮
  • Linux(CentOS)安装Zookeeper

    前置环境是装好Java环境 然后去zookeeper官网下载 http mirror bit edu cn apache zookeeper 下载好后把压缩包上传到服务器 去到服务器地下解压 tar zxvf apache zookeepe
  • 96. 不同的二叉搜索树

    96 不同的二叉搜索树 给你一个整数 n 求恰由 n 个节点组成且节点值从 1 到 n 互不相同的 二叉搜索树 有多少种 返回满足题意的二叉搜索树的种数 二叉搜索树的定义 二叉搜索树是一个有序树 若它的左子树不空 则左子树上所有结点的值均小
  • Java架构直通车——Kafka介绍和高性能原因

    文章目录 Kafka介绍 Kafka高性能原因 Kafka介绍 Kafka以前说过很多次了 包括了Kafka单独的介绍 Kafka与Fabric 这里知识简单说说 Kafka的主要特点就是基于Pull模式来处理消息消费 追求高吞吐量 一开始
  • JavaScript应该被放在什么位置

    1 JavaScript被放在中 首先我们要知道的是HTML 文档加载顺序是从上至下被加载的 而且加载途中遇到JavaScript的代码时就会把JavaScript的代码放入缓冲中 当浏览器找到与它相关的标签时才进行匹配 当我们把JavaS