| 一、今日学习 1.什么是jQuery？ jQuery是一个快速的，小巧的，功能丰富的js库 jQuery文件中暴露了一个对象给window---$ 2.特点 独特的选择器 链式的DOM操作 事件绑定机制 出色的浏览器兼容性 封装完善的Ajax请求 3.jQuery的选择器 匹配模式、匹配规则 作用：查找元素 语法： $('选择器') jQuery('选择器') $===jQuery 基本选择器 id选择器=== $('#id') class选择器===$('.class') 标签选择器===$('标签名') 层级选择器 子代选择器 后代选择器 兄弟选择器值得下一个兄弟 兄弟选择器值后面的所有兄弟 过滤选择器 第一个 最后一个 第几个 除自己之外的所有同级兄弟元素 4.jQuery对象与原生对象 $('选择器') duncument.querySelector('选择器') 相互转换： jq对象转为原生对象：jq对象[0] jq对象.get(0) 原生对象转jq对象：原生对象---$(原生对象) jq对象只能使用jq的方法 原生对象只能使用原生的方法 $(this)---jq对象 this---原生对象 5.操作class 添加类名 jq对象.addClass('类名 类名 ..') 删除类名 jq对象.removeClass()---删除所有 jq对象.removeClass('类名')---删除指定类名 判断 jq对象.hasClass('类名')---判断是否含有---布尔值 切换 jq对象.toggleClass('类名')---有就删除，没有就添加 操作样式： 获取： jq对象.css('样式名') 设置： jq对象.css('属性名','属性值') jq对象.css({ 'key':'value', 'key1':'value', ..... }) 6.操作属性 自定义属性： jq对象.attr('属性名') jq对象.attr('属性名','属性值') jq对象.attr({ 'key':'value', 'KEY1':'value', ... }) 标准属性： jq对象.prop('属性名') jq对象.prop('属性名','属性值') jq对象.prop({ 'key':'value', 'KEY1':'value', ... }) 7.操作文本 操作纯文本 text()---textContent/innerText 解析标签 html()---innerHTML 表单标签 val()---value 入口函数 $(function(){ js代码 }) $(document).ready(function(){ js代码 }) 如果是在头部进行外部引入js，需在js文件内声明入口函数，否则无法操作dom |
| 欢迎光临 菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育 (http://www.xingmaxueyuan.com/) | Powered by Discuz! X3.4 |