javascript标签放置位置
首先:放置位置哪里都能放
但是js代码很有可能不起作用:例如:往id为span的标签中定时插入数字
var time=document.getElementById("span");
function counttime() {
time.innerHTML=count;
count=count-1;
if(count<0)
clearTimeout(t);
setTimeout(function () { counttime() },1000);
}
counttime();
,<span id="span" style="color: #FF0000">
解析html由上到下解析,js代码无法找到id为span的标签。因此,如果全局变量直接获取标签则js代码应该放在所用标签位置下方。
解决办法1:使用window.onload令页面加载完成后再执行。则所有标签/内容加载完毕后才会执行function(),效果等同于将function放置于所获取标签之后。
<script>
window.onload=function(){
count=5;
var time=document.getElementById("txt");
function counttime() {
time.innerHTML=count;
count=count-1;
if(count<0)
clearTimeout(t);
setTimeout(function () { counttime() },1000);
}
counttime();}
</script>
</head>
<body> <p id="txt">
ssssssssssssssssssa
</p>
<body>
<title>test</title>
<script>
count=55;
function counttime() {
document.getElementById("txt").innerHTML=count;
count=count-1;
if(count<0)
clearTimeout(t);
setTimeout(function () { counttime() },1000);
}
</script>
</head>
<body>
<p id="txt">
</p>
<input type="button" onclick="counttime()" value="anniu">ssssss</input>
</body>
当获取标签在function内,则当调用function时才能赋值,所有将function放置在head、body内.body与html之间都行。
简单说,没有在全局变量直接获取标签则script放置任何位置都可,影响的是执行效率。
当在全局变量直接获取标签,则必须放置在所获标签之后。
javascript标签放置位置的更多相关文章
- javascript代码放置位置对程序的影响
在编写html文档时,javascript可以放置的位置有两个地方<head>或者<body>,但是放置的地方,会对 JavaScript 代码的正常执行会有一定影响.由于 H ...
- JavaScript放置位置区别
JavaScript放置位置区别 页面中的脚本会在页面载入浏览器后立即执行.我们并不总希望这样.有时,我们希望当页面载入时执行脚本,而另外的时候,我们则希望当用户触发事件时才执行脚本. 位于 head ...
- JavaScript <script>标签的位置、延迟脚本(defer属性)与 异步脚本(async属性)
一.<script>标签的位置 传统的做法是将<script>元素放在<head>元素中,例如: <!DOCTYPE html><html > ...
- JS代码放置位置、变量与数据类型、运算符与逻辑表达运算符
内容简要: 1.JS代码放置位置的问题: 2.变量与数据类型: 3.运算符与逻辑表达式的运算符 我的位置 全局问题:为何在网页推荐位置(一般在<head></head>内部 ...
- script标签的位置
1.在我们编写代码的时候,会在页面内使用<script>标签来写JS,虽然理论上script标签的位置放在哪里可以,但是还是有一点区别的. 2.为什么很多人把script标签放在底部: 初 ...
- JS基础 复习: Javascript的书写位置
爱创课堂JS基础 复习: Javascript的书写位置复习 js书写位置:body标签的最底部.实际工作中使用书写在head标签内一对script标签里.alert()弹出框.console.log ...
- 关于css,js放置位置的问题
一天,小明正在网上查找资料,项目中遇到的问题需要通过查阅资料来解决,他看到一个标题很有意思,觉得这应该是他要找的答案,于是他就点了进去,结果进入网站后几秒钟的时间,网页还是一片空白,过了好久才加载完成 ...
- JavaScript代码存放位置
JavaScript代码存放位置 HTML的head中 HTML的body代码块底部(推荐) 由于Html代码是从上到下执行,如果Head中的js代码耗时严重,就会导致用户长时间无法看到页面,如果放置 ...
- class12_pack_grid_place 放置位置
其中的部分运行效果图(程序见序号1): #!/usr/bin/env python# -*- coding:utf-8 -*-# ----------------------------------- ...
随机推荐
- 转 python 字符串前加r
在打开文件的时候open(r'c:\....') 加r和不加''r是有区别的 'r'是防止字符转义的 如果路径中出现'\t'的话 不加r的话\t就会被转义 而加了'r'之后'\t'就能保留原有的样子 ...
- svg画圆环
之前我已经分享了一篇css画圆环,为啥今天还要分享一篇svg画圆环呢? 原因是:css画圆环在部分ipone手机会有bug,最大张角为90°,所以圆环会有白色的间隙. 好了,开始代码展示: html: ...
- [Bzoj3224][Tyvj1728] 普通平衡树(splay/无旋Treap)
题目链接:https://www.lydsy.com/JudgeOnline/problem.php?id=3224 平衡树入门题,学习学习. splay(学习yyb巨佬) #include<b ...
- Java 8实战之读书笔记三:函数式数据处理
二.函数式数据处理 第4章 引入流 流是Java API的新成员,它允许你以声明性方式处理数据集合(通过查询语句来表达,而不是临时编写一个实现). 示例: import static java.uti ...
- windows10安装nodejs 10和express 4
最进做一个个人博客系统,前端用到了semanticUI,但是要使用npm工具包,所以需要安装nodejs,nodejs自带npm 下载 去官网下载自己系统对应的版本,我的是windows:下载 可以在 ...
- 六 BASH 高级变量
高级变量分为三类 变量扩展 ${变量名} 例 ${filename} 大括号 命令替换 $(命令) $(ls /) 小括号 算术扩展 $((算数式)) $(( ...
- Vue实例与组件的关系
所有的 Vue 组件都是 Vue 实例,可以看成Vue组件就是Vue实例的扩展. <div id="app"> <child></child> ...
- vue中v-model详解
vue中经常使用到<input>和<textarea>这类表单元素,vue对于这些元素的数据绑定和我们以前经常用的jQuery有些区别.vue使用v-model实现这些标签数据 ...
- django model的get和filter方法的区别
django的get方法: 1django的get方法是从数据库的取得一个匹配的结果,返回一个对象,如果记录不存在的话,它会报错. 2如果你用django的get去取得关联表的数据的话,而关键表的数据 ...
- Delphi Treeview 用法(概念、属性、添加编辑插入节点、定位节点、拖拽等)
今天再细研究了一下Treeview的用法,网上虽然总结了很多,但是还是有很多节点没有讲到了,也给使用中遇到很多问题.特地总结一下: 1.概念 Treeview用于显示按照树形结构进行组织的数据.Tre ...