jQuery这篇文章就够了

jQuery

  • jQuery是js的一个函数库,就是用js写的一堆函数。

jQuery的优点

  • 封装了各种DOM操作的API,简化了js的DOM开发。
  • jQuery中有各种选择器,能够快速定位DOM。
  • 解决了浏览器兼容问题。
  • 使用链式编程,隐式迭代简化了js的开发。
  • 简化了ajax的开发。
  • jQuery有丰富的插件。

引入jQuery


window.onload和document.ready的区别

  • 1.window.onload:
    整个页面加载完毕:包含音频、视频
    一个页面只能写一个window.onload,写多次,后写的会覆盖前面的,只显示最后写的。

  • 2.document.ready:
    整个DOM树绘制/渲染完毕,节点加载完毕
    一个页面可以写多个,从上到下依次显示

      window.onload = function(){
      			alert("window.onload1");
      		}
    
      	window.onload = function(){
      		alert("window.onload2");
      	}
      	
      	$(function(){
      	alert("jq1");
      	});
    
      	$(function(){
      		alert("jq2");
      	});
    

jQuery编程风格

$.(document).ready(function(){
		//JQ代码,相当于原生js的:document.ready
})
简写:
$.(function(){
})

JQ对象和JS对象转化

JQ对象:通过jQuery选择器拿到DOM对象,然后对其封装,使其能够调用jQuery的API,
相当于把DOM对象重新包装了一下。

$("选择器"):JQ对象
JQ对象不等于JS对象JQ的函数不能和JS混用

JS对象转换为JQ对象:
var JQ对象 = $(JS对象)
JQ对象转JS对象:
var JS对象 = $("选择器")[0];

jQuery选择器

基本选择器

  • id选择器

语法
$("#id"):获取对应id的JQ对象

color

//页面加载完毕时点击时触发change函数修改样式
  • 标签选择器:

$(“标签名”)


  • jQuery简介
  • jQuery语法
  • jQuery选择器
  • jQuery事件与动画
  • jQuery方法

你可能感兴趣的:(WEB基础)