HTML页面加载完毕后运行的js
Js方法:
<script type=”text/javascript”> window.onload=function (){ var userName=”xiaoming”; alert(userName); }
</script>
jQuery方法,需要引用jQuery文件:
<script type=”text/javascript”> $(document).ready(function (){ var userName=”xiaoming”; alert(userName); });
</script>
或者其简写:
$(function (){ var userName=”xiaoming”; alert(userName); });
在DOM加载完就可以执行(比window.onload更早)。在同一页面中可以多次出现.ready()
两者主要区别:Window.onload=function (){}:
当一个文档完全下载到浏览器中时,才会触发window.onload事件。这意味着页面上的全部元素对js而言都是可以操作的,也就是说页面上的所有元素加载完毕才会执行。这种情况对编写功能性代码非常有利,因为无需考虑加载的次序。
$(document).ready(function (){});
会在DOM完全就绪并可以使用时调用。虽然这也意味着所有元素对脚本而言是可以访问的,但是,并不意味着所有关联的文件都已经下载完毕。换句话说,当HTML下载完成并解析为DOM树之后,代码就会执行。
使用$(document).ready(function (){})一般来说都要优于使用onload事件处理程序,但必须要明确一点,因为支持文件可能还没有加载完成,所以类似图像的高度和宽度这样的属性此时不一定有效。
注:用把js放在页面底部的方法以及运用defer=”defer”的方法都是会出现问题的。最好使用$(document).ready(function (){})函数。
出处:https://www.cnblogs.com/66-88/articles/6605003.html
HTML页面加载完毕后运行的js的更多相关文章
- 在HTML页面加载完毕后运行某个js
js <script type="text/javascript"> window.onload=function(){ //执行} </script> j ...
- 两种方法实现在HTML页面加载完毕后运行JS
JS默认方法: <script type=”text/javascript”> window.onload=function (){ /*代码区域*/ } </script> ...
- 页面加载完毕后调用js方法进行布局操控 已实验
页面加载完毕后调用js方法进行布局操控 已实验 $(function(){ var check1 = $("[id$=SMS]").is(':checked'); var bl=$ ...
- php页面加载完毕后再显示购买按钮
php页面加载完毕后再显示购买按钮 $document.ready(function(){ $("#buybotton").show()})
- 页面加载完毕执行多个JS函数
通常我们需要在打开页面时加载脚本,这些脚本必须在页面加载完毕后才可以执行,因为这时候DOM才完整,可以利用window.onload确保这一点,如:window.onload=firstFunctio ...
- 当页面完全加载完成后执行一个JS函数
方法1.如下程序,当页面完全加载后执行openTheIndexPage()方法 <html> <head> <meta http-equiv="Conte ...
- layui 页面加载完成后ajax重新为 html 赋值 遇到的坑
页面加载完毕后,通过 ajax 按照返回值,为部分 html 赋值: $(function(){ ..... }) 直接这样写,报错,$ 没有定义什么的,错位原因为 jquery 引入错误. layu ...
- 在css加载完毕后执行后续代码
最近在写项目的framework,写个JQueryMessageBox的类,以使用jquery ui中的dialog()来显示消息框,为了使方法方便调用,便加入了自动判断页面是否加入了ui.js和ui ...
- js判断页面加载完毕方法
判断页面加载完成这个方法是很常见的,下面有三个常用的方法,各有利弊. 一.纯js方法 // (1).页面所有内容加载完成执行 window.onload = function(){ } // (2). ...
随机推荐
- P4556 [Vani有约会]雨天的尾巴
目录 思路 优化 过程中的问题/疑问 错误 代码 思路 每个节点维护一课线段树(当然是动态开点) 线段树的作用是统计这个节点有多少种粮食型号,以及最多的粮食型号 然后树上差分,u和v点 +1,lca( ...
- 在Linux安装和使用LinuxBrew
简介 LinuxBrew是流行的Mac OS X的一个Linux叉自制包管理器. LinuxBrew是包管理软件,它能从源(在Debian / Ubuntu的如"易/ DEB",并 ...
- SpringBoot Mybatis 分页插件PageHelper
添加maven配置: <!-- 分布插件 --> <dependency> <groupId>com.github.pagehelper</groupId&g ...
- hihoCoder week1 最长回文子串
题目链接 https://hihocoder.com/contest/hiho1/problem/1 做法 Manacher #include <bits/stdc++.h> using ...
- EF Core In-Memory Database Provider
原文链接 This can be useful for testing, although the SQLite provider in in-memory mode may be a more ap ...
- 51Nod—1174 区间中最大的数 线段树模版
在大佬们题解的帮助下算是看懂了线段树吧...在这mark下防一手转头就忘. #include<iostream> #include<stdio.h> using namespa ...
- Entity Framework Core一键生成实体命令
打开Vs中工具——Nug包管理器——程序包管理控制台 设置启动项目为存储实体模型的类库或控制台 Scaffold-DbContext "数据库连接字符串" Microsoft.E ...
- python学习 day011打卡 迭代器
本节的主要内容: 1.函数名的使用以及第一类对象 2.闭包 3.迭代器 一.函数名的运用. 函数名是一个变量,但它是一个特殊的变量,与括号配合可以执行函数的变量. 1.函数名的内存地址 def fun ...
- C#在高分屏上让窗体程序忽略系统的显示缩放
[STAThread] static void Main() { ) SetProcessDPIAware(); Application.EnableVisualStyles(); Applicati ...
- Git 基础 - 打标签
列出现有标签(或者使用git tag -l) $ git tag v0. v1. 如果只对 1.4.2 系列的版本感兴趣 $ git tag -l 'v1.4.2.*' v1. v1. v1. v1. ...