关于js与jquery中的文档加载
jquery中的$(document).ready()类似于javascript中的window.onload()，但是其中还是有很大区别的
1.jquery中的可以简化为$().ready()，$(function), 而js却不行必须全部写完。
2.同时js的window.onload()只能有一个，而jquery的$(document).ready()却可以有多个。
3.最重要的一点是window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。
$(document).ready()是DOM结构绘制完毕后就执行，不必等到加载完毕。
下面说说在项目中遇到的问题
先上代码，这个demo中我不用引入jquery包就可以使用类似jquery的$(id)(我个人不建议使用)，在这个demo中页面会弹出"1"，在此处完全没有问题。
<!DOCTYPE html>
<head>
<title>JS</title>
<script>
function $(id){return document.getElementById(id)};
window.onload = function(){
alert($("aaa").value);
};
</script>
</head>
<body>
<input id="aaa" value="1" />
</body>
</html>
再上代码，此处的问题会报错"Cannot read property 'ready' of null"，可以自己先想想为什么。。。
<!DOCTYPE html>
<head>
<title>JS</title>
<script src="js/jquery-2.1.1.min.js"></script>
<script>
function $(id){return document.getElementById(id)};
$(document).ready(function(){ //这是错误的代码案列
$("#aaa").click(function(){
$("#aaa").hide();
});
});
</script>
</head>
<body>
<a id="aaa" value="1" >aaaaaa</a>
</body>
</html>
问题在与我们对"$"定义了一个函数，同时又想使用jquery提供的"$",所以报错"Cannot read property 'ready' of null",问题在于我们写的"$"影响了$(document)这块，所以还是老老实实导包，别嫌麻烦，不然出现bug,要是在不熟悉的其中语法(代码就一行，项目大的话还不容易发现。o(╥﹏╥)o)，改bug就要更长的时间，也是醉了。
关于js与jquery中的文档加载的更多相关文章
- jQuery在HTML文档加载完毕后自动执行某个事件；
原来onchange=“fucntionname(parms)”: <select name="country" id="selCountries_{$sn}&qu ...
- 原生JS与jQuery文档加载完毕的写法
HTML是有执行顺序的,默认是自上而下执行.所以当我们的js代码在html代码下边的时候,可以正常执行,而当我们的js代码在html代码上边的时候,可以就无法正常执行了,这时,我们需要在文档加载完毕的 ...
- jquery-7 jquery中的文档处理方法有哪些（方法的参数表示功能增强）
jquery-7 jquery中的文档处理方法有哪些(方法的参数表示功能增强) 一.总结 一句话总结:多看参考文档,多看主干目录.一般的功能分两个方法来实现,一个对应标签,一个对应标签和事情,比如克隆 ...
- jQuery文档加载完毕的几种写法
js中文档加载完毕.一般在body加一个onload事件或者window.onload = function () {} jQuery中有好多写法,平时也不注意,别人一问,还真觉得头大. 下面是我整理 ...
- jquery文档加载几种写法，图片加载写法
jquery文档加载写法: $(function(){ }) ; //个人最常使用方式 $(document).ready(function(){ }); //调用文档对象下的ready方法传入一个函 ...
- 使用js主函数的原因是等文档加载完了才给里面的元素添加东西 如果不使用主函数则文档加载时候无法找到元素则不能成功给元素添加事件
使用js主函数的原因是等文档加载完了才给里面的元素添加东西 如果不使用主函数则文档加载时候无法找到元素则不能成功给元素添加事件
- document.write ： 什么是在html输出中使用，什么是文档加载后使用？
理解:您只能在 HTML 输出中使用 document.write.如果您在文档加载后使用该方法,会覆盖整个文档. Javascript中只能在 HTML 输出流中使用 document.write, ...
- jQuery---jQ动画(普通,滑动,淡入淡出,自定义动画,停止动画),jQuery的事件,jQ事件的绑定/解绑,一次性事件,事件委托,事件冒泡,文档加载
jQuery---jQ动画(普通,滑动,淡入淡出,自定义动画,停止动画),jQuery的事件,jQ事件的绑定/解绑,一次性事件,事件委托,事件冒泡,文档加载 一丶jQuery动画 show,hide, ...
- js坚持不懈之14：不要在文档加载之后使用 document.write()示例
在看w3school的JavaScript教程时,关于文档输出流中有这么一句话:绝不要在文档加载之后使用 document.write().这会覆盖该文档. 不太明白什么意思,找了一个例子: < ...
随机推荐
- 【CSP2019】括号树 题解（递推+链表）
前言:抽时间做了做这道题,把学长送退役的题. ----------------- 题目链接 题目大意:定义$()$是合法括号串.如果$A,B$是合法括号串,那么$(AB),AB$为合法括号串.现给定根 ...
- Vuex mapAction的基本使用
mapAction-store中的异步方法 import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) export default new ...
- 提升团队幸福感之：集成 GitLab && JIRA 实现自动化工作流
佛罗伦萨 - 圣母百花圣殿(图) 前言 GitLab 和 Jira 是平时开发过程中使用非常高频的代码管理系统(开发人员)和项目管理系统(项目管理),通过两套系统的协作完成平常大多数的功能开发,但是两 ...
- 理解RESTful原理
如何给老婆解释什么是RESTful 老婆经常喜欢翻看我订阅的技术杂志,她总能从她的视角提出很多有趣的问题. 一个悠闲的周日下午,她午觉醒来,又习惯性的抓起这个月的杂志,饶有兴趣地看了起来. 果不其然, ...
- 共享&img （给作者自己
--------------------------------------------------------- ------------------------------------------ ...
- Typescript node starter 2.Router Middleware
Router 路由器对象是中间件和路由的一个独立实例.可以将它视为一个“迷你应用程序”,仅能够执行中间件和路由功能.每个Express应用程序都有一个内置的应用程序路由器. 路由器的行为类似于中间件本 ...
- 完全基于 Java 的开源深度学习平台，亚马逊的大佬带你上手
本文适合有 Java 基础的人群 作者:DJL-Lanking HelloGitHub 推出的<讲解开源项目>系列.有幸邀请到了亚马逊 + Apache 的工程师:Lanking( htt ...
- Jmeter 常用函数（26）- 详解 __chooseRandom
如果你想查看更多 Jmeter 常用函数可以在这篇文章找找哦 https://www.cnblogs.com/poloyy/p/13291704.html 作用 从指定的范围里面取值 语法格式 ${_ ...
- JavaScript学习系列博客_23_JavaScript 构造函数
构造函数 - 构造函数是专门用来创建对象的函数 创建一个对象时,通过构造函数的方式来创建.这是通过Object()这个构造函数来创建的一个实例obj. var obj=new Object(); - ...
- JavaScript学习系列博客_8_JavaScript中的关系运算符、赋值运算符
关系运算符 - 关系运算符用来比较两个值之间的关系的 >.<.<=.>= 先说这四个.如果关系成立则返回true,关系不成立则返回false. - 如果比较的两个值是非numb ...