博客列表 >0303作业+jQuery入门+10期线上班

0303作业+jQuery入门+10期线上班

江川林
江川林原创
2020年03月16日 20:48:39957浏览
jQuery引入文档

1,在官网下载2,在又拍云等进行CDN引入3,用composer引入

jQuery语法,4大应用场景

1,$(CSS选择器)2,$(JS对象),将JS对象转化为jQuery对象3,$(带标签的HTML文档),直接将此转化为HTML元素4,$(回调函数)以下是实操

// console.log($(document).jquery); // 1,jQuery语法 // $(选择器) var one = $('.one', [name]); // var one = $('.one'); // one = $('[name]'); // one = $('ul .one'); console.log(one); // $(JS对象) var two = {one:"20",two:30}; $(two); // console.log($(two)); // $(带标签的HTML文本) $('我们是一家').insertBefore('form'); // $(回调函数):在文档加载之后并DOM处于可操作额状态才会调用 $(function () { $('ul>li:nth-child(2)').css('color', 'red'); }); // 2,jQuery函数:jQuery()/$(),用于创建jquery对象,注册DOM就绪回调,也被称之为jQuery全局对象 // 3,jQuery对象:是jQuery函数的返回值,由多个HTML元素对象组成,是一个类数组,具有length属性 // 4,jQuery方法 var lis = $('ul>li'); // console.log(lis); // console.log(lis.size()); // console.log(lis.get(1)); // console.log(lis.toArray()); // 5,静态方法与普通方法 $.each(lis,function (index, value) { // console.log(index,value) }); $('ul>li').each(function (index, value) { // console.log(index,value) }) jQuery函数

-jQuery()/$()-用于创建jquery对象的工厂函数

jQuery对象

-是jQuery函数的返回值-返回多个HTML元素对象组成的文档元素集合

jQuery方法

-size(),返回被选元素中子元素的个数-get(),获取想要的子元素,参数为0开始的索引

查询结果的处理

-toArray(),将jQuery对象转换成真正的数组-each(),遍历jQuery对象$.each(选择的元素,function(index,value){})或者$(选择的元素).each(function(index,value){})-map(),遍历对象,返回新数组$.map(选择的元素,function(index,value){})-index(),返回选择元素的索引值-is(),判断元素中是否存在某元素以下是关键代码

// $('ul li').css("background-color",'yellow'); var arr = $.map($('li'), function (value, index) { if (index % 2) return value }); console.log(arr); // index() var index = $('li:nth-child(2)').index(); // console.log(index); $('li').click(function () { console.log('当前点击的是:' + ($(this).index() + 1)); }) // is() var is = $('li').is('.one'); console.log(is); // 5,静态方法与普通方法 $.each(lis,function (index, value) { // console.log(index,value) }); $('ul>li').each(function (index, value) { // console.log(index,value) })
声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议