jq的使用
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="jquey.min.js"></script> <style> div { width: 200px; height: 200px; background-color: red; } </style></head><body> <div></div> <script> $('div').hide(); </script></body></html>
jq的入口函数
$(function (){ ...//此处是页面DOM加载完成的入口});$(document).ready(function(){ ...//此处是页面DOM加载完成的入口});
jQuery的顶级对象$
$是jQuery的昵称,在代码中可以使用jQuery代替$,但一般为了方便,通常直接使用$。
jq与DOM的转换
1.DOM对象转换为jq对象
$('div')
2.jq转换为DOM对象(两种方法)
$('div')[index] //index是索引号$('div').get(index) //index是索引号
基本选择器
$("选择器") //里面选择器直接写css选择器即可,但是要加引号名称用法描述
ID选择器$("#id")获取指定ID的元素
全选选择器$(‘*’)匹配所有元素
类选择器$(".class")获取同一类class的元素
标签选择器$("div")获取同一类标签的所有元素
并集选择器$("div,p,l")选取多个元素
交集选择器$("li.current")交集元素
层级选择器
名称用法描述
子代选择器$("ul>li");使用>号,获取亲儿子层级的元素;注意,并不会获取孙子层级的元素
后代选择器$("ul li");使用空格,代表后代选择器,获取ul下的所有li元素,包括孙子等
设置样式
$('div').css('属性','值')
筛选选择器
语法用法描述
:first$('li:first')获取第一个li元素
:last$('li:last')获取最后一个li元素
:eq(index)$("li:eq(2)")获取到的li元素中,选择索引号为2的元素,索引号index从0开始
:odd$("li:odd")获取到的li元素中,选择索引号为奇数的元素
:even$(“li:even”)获取到li元素中,选择索引号为偶数的元素
筛选方法
本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请
点击举报。