00:00
接下来我们看一下这个几块的元素的这个筛选,筛选在哪,筛选在呃这个这部分大家看啊,筛选的这边就是这些就是严肃的筛选,我们挑出个别常用的来看一下啊,那比如说EQ括号这个方法呢,它的功能啊。跟冒号EQ一样,那还记得这个吗?啊,获取指定索引的元数吧,是吧,那就是它了哈,那还有这个first呢,获取第一个元素的功能呢,功能跟呃,冒号first一样,来我们还是看看吧,一直讲一会就记不住来EQ获取第N个元素啊,所以从零开始算,然后看看吧,他说获取匹配的第二个元素,这是一个P,这是两个P啊,他先按照标签名查所有的P,然后他开始说我要索引是第二个P是吧,就一了是吧,然后这不就so is this吗?
01:10
能看懂吧,好,现在呢,再来看一下我们刚刚说的这个first是第一个吧,你看获取第一个演说啊,然后现在还是那个无序列表,它先按照标签名查看见吧,查完之后呢,得到五个,五个以后他要这五个里面的只要一个。只要一个那一个之后你看Mr it1。这个东西是写在外面的啊,跟以前的用法不同,以前是写在里面,现在写在外面这个方法了,哎,你看刚刚那个EQ也是一样,是不变的方法去用了,用法不同啊好,还有这个,呃,Last这个方法啊,然后它的功能是吧。功能跟冒号。一样功能跟这个冒号last是一样的。Okay。
02:02
好,那我们看一下吧,哎,就这个last嘛,取最后一个嘛,还这个无序列表,哎,他先按照Li标签明查不到五个啊,得到五个,然后他说我只要最后一个,那就类似爱上五倍,你看这没啥可说的啊,然后再看看这个future,翻译过来是啥呀?过滤吧,啊就进一步过滤呗,进一步过滤再挑出个别的内容来啊,你看流向匹配的元素,我们看看吧,Future啥情况?Future它三选,注意指定表达式就是这个匹配的元素集合对吧?S次过滤嘛,就简单点说,它有个示例,那他这个事例其实写的也不是特别好,你看下哈,这是一个P,这是两个P啊,这是三个P啊,嗯,3P对吧,然后呢,他按照P这个标签名去查啊,查到这上面三个P,然后呢,查到三个P以后,它就过滤一下,要点future就过滤是吧,它过滤什么内容,点s select,这是候类似检择T啊。
03:02
再选一下,他说你这三个P里面哪一个是有类型,而且是selected的,是不是只有他呀不下了吗?对吧,好哎,那其他我就不看自己看啊。这就是过滤了啊,再看看这个呃意思判断判断呃是否匹配给定的选择器,就是它这里会有一个1XP这样的表达,是我的选择器啊,只要有一个匹配就返回出。啊,就判断用的,我们看一下他的事例啊。意思是吧,呃,根据选择器。动对项元素啊,或者几颗内啊来检测这个元素集合,哎,如果其中呢,至少有一个符合这个表达式啊,就返回处啊,我们看它的示例吧,啊呃,他的书力行不行啊,哎,还行,这可以,这是一个附秒单,里面是一个复选框是吧。它这里是查,按照标签名查就是它,然后还要过滤属性是不是还是它对吧,然后取调用piel派是什么,取负元数,负元数是不负标签呐,然后就开始说你是不是负啊,是就是处嘛,是吧?啊,因为你肯定是负中签嘛,保处OK呃再来看啊,还有has has,这这个也是跟前面讲过的,返回包含有匹配选择器的元素的元素跟哪个呀。
04:30
功能跟冒号has一样,这不讲过的吗?跟这个效果差不多啊,来看一下has。看啊来,呃,这里面你看不出来效果,它这个只有示例没有效果,看见吗?我给你写一个吧,啊,我给你写一个。呃,咱们把这个拿过来,把这个东西给它做掉啊。好,然后我咋写呢,我写多个div啊。
05:03
DIV1复制一下DIV2DIV3,然后在这里面写上空格四分,诶,提示没有。CTRLZ啊。好的不行,SPA奔SP。我是不过了,按table建设啊也行好,然后呢,我们再来看。这里面咱们说div中的。十分好,那现在注意看着哈,我按照。诶啊,掉枪了一次。啊。咱们敲这个啊,注意看我写DD这个时候是不是查到全部的D。OK点。Length,好,那肯定是三个啊,这面上所说的走拿到三个吧,那现在呢,我的这三个里面,我说我要要谁,我只要它包含有spend这个div,那怎么办呢?就在这找一次,他说你们谁有spend,看见吗?Has不是有的意思吗?你们谁有spend呢?那就只有这个div,那个数就是一个。
06:20
看见吧,那这个时候这么查,这么查呢,到底是返回div还是边呢?对div咱们刚刚讲过了吧,要的是外面那个大啊,要的是div好。然后再看看这个nut啊,三组匹配选择器的两处啊,那T嘛,功能跟前面的一样啊,就是功能。冒号。那个。一样功能跟冒号那T一样,哎,就咱们了解一下,好,那我演示一下吧,我看看它有没有好的事例啊,先看看那就这个删除与指定表达式比的元素啊,他说从P元素中删除带有select的ID的元素。
07:10
这是一个P,这是两个P,他有ID是不是呀?哎,他说先按照标签你查这两个P呗,但是这两个P里面他不要什么,他不要你看在查什么,这是不是按照ID显择器来查,他查到这个,然后取出动对象,他说我不要这个,那是不要他是不是只能这开了。你看啊,它加个零呢,就变成动的向,它通过动向过滤了。呃,再来看。Children children是返回匹配给定选择器的子元素啊,这个就跟什么一样啊,就跟功能跟啊大于号一样,还记得吗?啊,咱们不是有了这个这个做法是吧?来。Children是它啊,它所取得一个包含匹配的元素集合中每一个元素的所有元素集合。
08:07
来看这里吧,呃,他说。查找div中每个词元素。啊,这是P,这是div,看见吗?他先查用这个div,然后要子元素children准,那这个div里面只有一个子元素spin,结果都是spin,这没有啥可说的。还没啥可说的好。我们再来看还有什么find find是后代,后面这个是什么呀,功能跟这个好像是祖先。主先空格后台啊,这个选择器一样,是哪个选择器来着,我记不住那个了,来是不是他看见吧,就跟这个一样空格吗。但是他们家我。啊,算了。那我过滤掉它那个样式。
09:00
跟这个选择器呢一样啊,就是主旋扩台来我们看着吧,嗯,哪个呀,Fine是这个啊,他说搜索所有与指定表达式匹配的元素啊,这个函数是找出正在处理元素的后,看见后段了吗?后代的啊,号码法啊,好,再看看啊,他说从所有的登录开始,进一步搜索下面的span,他说跟这个功能相同,看见吧,是不是组件空格后代啊,就这个效果啊,那它怎么写啊,这是一个P啊,里面放一个SP啊,他先用呃核心函数,通过标签明查P是不是一个,他开始说,诶,在我这个P的基础之上,你再给我找一下我有什么后代。我的后方有谁span对吧,是不是找出来了,写的这个N就是找这个span OK。嗯,然后再看看哈,Fire也说了next next是跟那什么一样啊,就是功能跟PV,诶穿制服的女孩啥情诶啥情况啊PV哎加号这个nest啊功能一样对吧,这个输入法出卖了我们来咱们注意看一下,它这个ne干法是返回当前元素的下一个兄弟元素。
10:20
啊,返回当前元素的下一个兄弟元素,来我们看一下吧,呃,Next是这个吧,它所取得一个包含匹配的元素集合中每一个元素减零的后面同配元素集合,啊,就是取它后面的一个元素了哈,来看一下这是一个P啊,这是两个P啊,这是一个div是吧?它先按照标签名查P,就两个P吧,然后它是next,那就是取每一个P后面那个元素啊,第一个P后面的元素是不是一个p hello again,你看到吗?那这个P后面那个元素呢?是div是不是下来了?就这样去到后面啊好。
11:02
那next呢,Next是跟这个功能跟对波浪线那个啊,PV波浪线。叫哦,还是next next吧,好像是next来看一下啊。这他写的是啊spring是吧,兄弟啊,哎哎,拿出来。走诶没复制上,没有复制上。好过来跟这个啊功能一样,后面的兄弟是吧,咱们都是兄弟,好,咱们看看这个啊,看看这个示例行不行,Next o啊,查找当前元素之后啊,所有的同位元素就后面的啊来呃,这个你也看不到效果,我记得是我给你写,我给你写吧,好吧,我把这个拿过来啊。
12:00
你在这里看不出效果来,我把这个东西往这一贴啊,反正都是div嘛,是吧,然后他的这个示例的代码啊,我依然贴过来,然后你在我这里看就行,上面的我给你注掉,你先看着哈,他是不是按照标签名下,那就是你这有几个D位就几个位是吧,这是他可说的呀,你四个嘛。第一个扁着急,扁着急啊,然后他是不是只用第一个呀,那就是他,然后他说要第一个后面全部的看见吧,是他们仨呀,他说给他们仨加上一个样式来,你运行一下就看出效果了,M12。看看看第一个是不是第一个后面三加上了,他自己没有看吧,啊就这个了哈,后面全部的还有个是next until哎,Next时候下一个是吧,Until是到什么什么为止啊,你可以翻译一下啊。
13:00
N until是不是到什么什么为止啊,是在什么什么时啊,在什么之前对吧,这个意思了,来这是干嘛呢?返回当前元素到指定匹配的元素为止的,后面元素就是取一个区间了啊,就是取一个区间,来我给你演示一下,看看它这个它有好的事例没有next。他这个视力也不行,你看不出来效果,这是定义列表,你也咱们也没怎么讲过来给你换一下啊,比如说。啊,我这里写个SPA,然后我这里说什么东西呢?哎,注意看啊,我说我从第一个div开始,后面到什么呀,注意看啊,点next spend知道啥意思不,从第一个往后算到spend就停下来。两个都懂吗?那我在这边一刷新,从第一个开始,后面往后算,是不是两个呀,到时SPA就停下的n until嘛,就停下亮嘛,哈,好,就这个意思,呃,然后这没啥可说的,取负衍数。
14:06
啊,这是取负元素啊好,负元素的话,我看它有没有什么示例啊,负元素来取了一个包含的所有平的元素集合,唯一的负元素集合啊,来查找每个元素的负元素,这个是个dava里面放的一个P2个P是吧?然后他看到这个P按照标签没查这里面两个P嘛,然后取点判的是什么,是不是取负函数啊。去负元素啊,那负元素就是D呗,这有啥可说的呀。是吧,外面这个是D。哎,然后再来看看。PEV,这是什么?返回当前元素的上一个兄弟元素,就是就是这个的一个反向能力什么,这是后面一个,就是就是前面一个啊前面一个来我看看这示例往下啊,P rev,也就它取得一个包含匹配的元素集合中每一个仅邻的前一个同位元素集合是吧?就取前面的啊啊这是一个P,这是div,这又是一个P,他先按照标签明查看见吗?得到这个P和这个P就放了,就俩P是吧?哎,然后呢,取前面的,那你前面第一个P前面是不是没有啊,但是这个P它前面有个div,所以结果中是不是有个div啊,就这样,就这第一个前面有它也会取出来,我给你演示一下哈,比如说我把这把这两个P给我复制过来是吧。
15:37
哎,把这个东西复制过来,然后我的前面呢,再整一个div看见了吧,哎,我还是隔开一下,有点看不清啊。胃口太乱了。这样可以吧啊,两个P的哈,我先给它做掉好走,哎哎,然后呢,按照P来查是吧,然后取它前面的。
16:05
去他前面呢。OK。好,咱们看看长度。总数两个。看见吗?就是就是你第一个P前面它有个div啊,你这个P前面也有个div是吧?啊,就是取各一个啊可以啊,OK,那么我们接着往下面看,你还可以取前面全部。去前面全部啊,来我看看有没有事例啊呃,前面全部就他。你看查到当前元素之前的所有同类之前的全部的话,嗯,这是一个div,这是一个啊,这个效果你看不出来,这个你看不出来效果,我我在这边做吧,啊这样子你能看得出来一点。呃,删掉啊,这个删掉这样,诶我没复制上啊。
17:03
别着急,别着急啊,我复制。啊,我粘贴可以了哈,然后我稍微格式化一下啊,发行一下。邀请。嗯,好,然后我拿他这个代码啊复制过来,然后你稍微再看看就知道啥意思了啊,诶又删多了,好来请看一下看法,他这是不是找最后一个DNA,然后说这是取他前面全部吧,他说我最后一个前面全部就他们仨嘛,是吧,他说你们仨都成这个样子,哎,都将这个样式来,你在这边刷新一下,走F12了,看一看后面这个前面三是不是都加上了,就这效果了啊呃。我来看看下一个就是p until是什么呢?就是到前面为止的元素啊,到时为止的元素,我看看还有没有什么示例啊。
18:03
偏他这个视频你也看不到效果,来我给你写一个吧,嗯,比如说我写个SPA。啊好,那我说我最后一个PV spend。这能理解吧,就是我最后一个往前面数倒了,SPA是不是停下来?那刚好还是他们仨吧。我刷新看你是不是还这么三,如果说我这个SPA稍微的往下移一点点,是不是只有两个。就这意思,看见吗?就这意思啊。来看看还有啥啊,还有就是兄弟嘛。反馈所有的兄弟,所谓兄弟就是我前面和我后面的。啊,我前面和我后面的,呃,那我指一个,比如说我我这个spend兄弟是不是前面和后面呢?呃,那我就。啊,然后我要兄弟。
19:02
Spring是吧,就是我前后的嘛,来刷新一下,我SP前后是不是都是div都加上了。嗯,OK,然后呢,还有ADD啊,ADD是干嘛呢?是把an匹配的选择器的这个元素啊,添加到前面的这个几块的对象中返回,就是加到一起给你返回,嗯,我看看有没有什么好事例,我给你写一个吧,好吧,就比如说。好,到了伏哎,这里写上DV这个时候长度是几个呀,是不是四个,看见吗?然后它在这个基础之上,你注意看了啊ADD了,看见了吗?调用它,他说我不只要div,我还想要spendn。那这个方法返回的结果就是什么?就是div加span,能理解吗?那就是五个。
20:01
那就这样一个效果啊,就这样一个效果啊,好OK,这个呢,就是元素的筛选,我们看看元素筛选这个练习啊,这个练习。关闭其他好,我运行一下也说财产有点多啊。咱们从第一个按钮开始。我打开往下啊。第一个按钮是什么呀?他说选择索引值等于三个元素,使用EQ是这个方法来啊,首先是他用的是不是div啊,然后EQ,诶三。啊走大家看一下,我点012是不是三呢,就是它了啊,然后再看第二个first,选择第一个D元素啊,啊第一个D元素人家要的还是D啊,先选择标签名,然后在里面过滤一下first。第一个D不由他嘛。
21:03
呃,再看last最后一个D吧,那你这里还是last d嘛,是吧,然后呢,后面写上一个last方法就完事了啊。走,你last,就他没上课说的。呃,再看看future future是过滤的意思,他说在div当中过滤所引为偶数的,那怎么办?你先选出全部的div,然后跟人家说来,你给我过滤一下。是吧?怎么过滤呢?一问啊,这就是偶数的呀,这是点吗?稍等哦,这个写错了,这是点啊来咱们刷新一下啊,数的哪啊这个啊来这是不是这一步不偶数的啊,零啊偶数吗?一没有二选项呢?三没有四选项了吗?后面意思类推是吧?这都是偶数的。呃,他说用意来判断一下ID为万是空啊还是非空?
22:05
来吧,Idv one连意思你到底是空不空,你空不空是吧,来idv one是谁呀?I是不是这个呀,这个空吗?非空非空,它就会说什么false是吧,就会false OK,好,然后再看这个has,他说选择div中包含mini的。哎,就是首先你要的是不是div啊,但是你这个DNA要过滤什么东西,是不是要有class mini这东西啊,那这里写的是div,然后这个div要检查什么呢?诶你们家有没有class mini啊。就那种。来,我点一下。走这个是不是大的呀,这些大的里面是不是有小的卡啊,就这样子吗?啊来我们再来看一下。
23:02
诶到哪个了?呃,到第七个啊,他说第七个什么呢?选择D,但是我不要克拉维冠,那首先现在要的是D吧,那你去掉一部分呗,是吧,那可不就去掉一部分嘛,去掉哪些啊,点class one吗。能理解吧,在GS里面单引号和双引号数都是字符串的都可以啊,这不影响啊,就去掉那些class观就大了,呃,接着我们再来看。Children准是吧?在body中选择所有class为one的div元素。好的,这个时候要注意了,前面是什么时候body啊。然后这后面用的是children。Children,好,稍等,现在如果是这么写,那可就不一样了。看见了吗?是不是都绿了,为啥?因为这些是不是都在Bo里面的元素?
24:04
哎,为什么这个没有氯,就因为他们不是body的子元素,孙子元素了吗?哎,但是人家还要什么,人家说不只是要子元素,而且是不是还要DNA啊,那这个时候你还得再过滤要DNA,而且还要拉1万个DNA吧,爆再写的写点爆了啊,写就行了,再来一次。哎,是不是点不是点错了,就确认这个吧,这就是class one,看见吗?OK。哎,然后再来看一下fine fine是不是找后代呢?就不仅仅是子元素,孙子也算对吧,曾孙子也算是吧?哎,他说在body里面选择class为mini的B元素,那怎么写?首先是body。家里面写上find什么东西呢?Div点就长一些小的吗?
25:02
看见吧,找成一个小的啊呃,然后再来看,哎,他说呃,这个什么选择idv one的下一个div,那你怎么先找到IV one的呗,比如说我们找班长前面呢,那你是不是先知道班长在哪才行啊是吧,我们先找到IV one,然后找到前面的呢,点P嘛。前面一个要谁啊,是不是要div啊,加上这个过滤啊,加那个过滤来,嗯。这前面诶这是前面吗?他们说下一个是吧,下一个是next啊来刷新一下。ID one的下一个是不是他呀,ID为错呗,再来看next or,就是后面全部的啊,哎,他说ID one后面全部的spend,那来吧,你先知道IV one,然后next all是吧,后面全部的什么呀,Spend。
26:01
呃,在哪儿?这个是吧,好,这个是不是后面的吗?是吧?呃,然后再看看这个next是吧,他说什么呢?从ID为one到spend为止,看见了吗?中间的那种,那你前面肯定就是ID为one。Next是不是到十分为止?看见了吗?ID为万和四片为止,ID为one和四片为止。好。然后这个时候注意看一下。Be。取复原数,他说取谁的复原数啊?Class为mini的复原数,点mini点。来,你看一下。
27:00
Costs me是不是小的?小的复元素不是他们大的吗?是吧?那再接着往下看,他说idv出的上一个div idv处上一个D。看见了吧,ID位数上一个。哪一个来着,到这个了吧,走IDV处的上一个idv。好,再看看前面哦,对吧,Spain前面所有的div,那你是不是写成Spain了,SPA前面。所有的div看见了吗?啊,那我们写一下。Spend前面所有的div spend前面这是不是都是div对吧?都算了吗?啊呃,再来看spend向前到I DV one为止的,那这是什么?Spend向前。ID为为主吧,好。
28:03
走呃,十倍向前呢,就这个啊,走你看十倍向前到他是不是停下来了,哎,就这样,嗯,还有这个。哎,Siblings,这是取全部的兄弟吧,谁的呀,I为two的,那你就先把这个two写下来,嗯,SI是吧,所有的兄弟来走。这是不是所有的兄弟啊,除了他自己之外,前后嘛,如果你想过滤呢,其实可以加他啊,根据你的需要,比如说我只想要div啊,那就加上这个div,它就可以过滤,只要div。看见了吧,你也可以过滤其他,比如说我只要10SPA行不行啊,那你就写呗,他就会只把10SPA给你亮下呗,啊这十倍嘛,你根据你的需要去写啊,你要不过滤的话就全部,哎,不过滤就全部。那咱们看最后一个。
29:00
啊,最后一个什么呢?选择所有的元素和ID为的元素啊,别着急一个一个来哈。人家说Spain数数这么写啊。来刷新一下这十倍元素吗?还有ID为two的,那怎么办?Ad啊,ADC是不是把这个结果加进去啊,Idv处的。看见吗?Spend和I DV two,你甚至还可以一直写,如果你有需要的话,能理解吧,比如说我再写个ADD,我要什么I DV one是不是也可以啊,啊可以啊,你这样就需要就行了,走是吧?啊是这么个情况。
我来说两句