菁英数字科技(猩码)-猩码学苑-专注软件开发人才菁英教育
标题: 2022-11-17 王嘉乐 [打印本页]
作者: yousay! 时间: 2022-11-17 18:57
标题: 2022-11-17 王嘉乐
一、今日学习内容
jQuery
jQuery是一个快速的,小巧的,功能丰富的js库
jQuery文件中暴露了一个对象给window----$
学习jQuery就是学习里面的属性和方法
特点 :
独特的选择器
链式的DOM操作
事件绑定机制
出色的浏览器兼容性
封装完善的ajax请求
jQuery的选择器
匹配模式 匹配规则
$('选择器') jQuery('选择器')
$===jQuery
1.基本选择器
id选择器===$('#id')
class选择器===$('.class')
标签选择器===$('标签名')
2.层级选择器
子代选择器 $('父选择器>子选择器')
后代选择器$('')
兄弟选择器之下一个兄弟
兄弟选择器值后面所有的兄弟
3.过滤选择器
第一个
最后一个
第几个
除自己之外的所有同级兄弟元素
js对象与原生对象
$('选择器')document.querySelector('选择器')相互转换jq对象转为原生对象:jq对象[0] jq对象.get(0)原生对象转jq对象:原生对象-----$(原生对象)jq对象只能使用jq的方法原生对象只能使用原生的方法$(this)---jq对象this----原生对象
操作class
1.添加类名 jq对象.addClass("类名 类名 ...")2.删除类名 jq对象.removeClass()---删除所有 jq对象.removeClass('类名')---删除指定类名3.判断 jq对象.hasClass('类名')---判断是否含有---布尔值4.切换 jq对象.toggleClass('类名')---有就删除,没有就添加
操作样式
1.获取 jq对象.css('样式名')2.设置 jq对象.css('属性名','属性值') jq对象.css({ 'key':'value', 'key1':'value1', ..... })
操作属性
1.自定义属性 jq对象.attr('属性名') jq对象.attr('属性名','值') jq对象.attr({ 'key':'value', 'key1':'value1', ..... })2.标准属性 jq对象.prop('属性名'); jq对象.prop('属性名','值'); jq对象.prop({ 'key':'value', 'key1':'value1', .... })
操作文本
1.操作纯文本 text()=----textContent/innerText2.解析标签 html()----innerHTML3.表单标签 val()----value
入口函数
1.$(function(){ js代码})2.$(document).ready(function(){ js代码})
欢迎光临 菁英数字科技(猩码)-猩码学苑-专注软件开发人才菁英教育 (http://www.xingmaxueyuan.com/) |
Powered by Discuz! X3.4 |