4-2 编程练习

结合所学的祖先后代选择器,实现如下图所示效果

任务

(1)使用祖先后代选择器将第二段文字背景色变成红色

(2)使用jQuery的.css()方法设置样式,语法css('属性 '属性值')

参考代码:

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>慕课网4-2 编程练习</title>
</head>
<body>
<div class="box">
<ol>
<li>道终来归正法</li>
<li>课书聊自限三更</li>
<li>网中跳出便飞腾</li>
<li>首身离兮心不惩</li>
<li>选取灵芝草尽芟</li>
</ol>
<ul>
<li>前望舒使先驱兮</li>
<li>端端正正人如月</li>
<li>工夫却是花枝浅</li>
<li>程文堆案晨兴早</li>
<li>师尚父年浑未艾</li>
</ul>
</div>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
<script>
$(document).ready(function() {
//此处填写代码
$('ul li')
.css({'background':'red'})
});
</script>
</body>
</html>

慕课网4-2 编程练习:jQuery祖先后代选择器小案例的更多相关文章

  1. 慕课网4-6 编程练习:jQuery后排兄弟选择器

    4-6 编程练习 结合所学的兄弟选择器" ~ ",实现如下图所示效果: 任务 (1)使用兄弟选择器" ~ "将技术语言的背景色变成红色 (2)使用jQuery的 ...

  2. 慕课网 javascript深入浅出编程练习

    任务 请在index.html文件中,编写arraysSimilar函数,实现判断传入的两个数组是否相似.具体需求: 1. 数组中的成员类型相同,顺序可以不同.例如[1, true] 与 [false ...

  3. Jquery广告浮动效果小案例

    导入<script src="<%=path%>/html5/js/jquery.js"></script>文件 <SCRIPT type ...

  4. jQuery的DOM操作小案例

    案例一:下拉列表左右选择 <body> <div> <select style="width:60px" multiple size="10 ...

  5. 【学】jQuery的源码思路1——后代选择器

    jQuery的源码思路1--后代选择器 这里探讨一下jQuery中后代选择器的封装原理,并自己写一下 getEle('#div1 ul li .box');接受的参数就是个后代选择器,类似于这样: # ...

  6. [jQuery学习系列六]6-jQuery实际操作小案例

    前言最后在这里po上jQuery的几个小案例. Jquery例子1_占位符使用需求: 点击第一个按钮后 自动去check 后面是否有按钮没有选中, 如有则提示错误消息. <html> &l ...

  7. jQuery基础---常规选择器

    内容摘要: 1.简单选择器 2.进阶选择器 3.高级选择器 发文不易,转载请注明出处! jQuery 最核心的组成部分就是:选择器引擎.它继承了 CSS 的语法,可以对 DOM 元素的标签名.属性名. ...

  8. 第一百六十四节,jQuery,常规选择器

    jQuery,常规选择器 学习要点: 1.简单选择器 2.进阶选择器 3.高级选择器 jQuery 最核心的组成部分就是:选择器引擎.它继承了 CSS 的语法,可以对 DOM 元 素的标签名.属性名. ...

  9. 慕课网2-5 编程练习:通过jQuery通配符选择器进行文字变色

    2-5 编程练习 请请使用*选择器将div标签中的字体颜色变成红色 效果图: 任务 (1)使用通配符选择器 (2)使用jQuery的.css()方法设置样式,语法css('属性 '属性值') 参考代码 ...

随机推荐

  1. 添物不花钱学JavaEE(基础篇)-综述

    JavaEE由一堆基础标准组成.JavaEE开发一般需要如下工具和掌握如下内容: Java环境 Eclipse或其他开发工具 Tomcat容器或类似软件 Jsp/Servlet/Web/JDBC的掌握 ...

  2. 找出消耗CPU最高的进程对应的SQL语句

    COLUMN PID FORMAT 999COLUMN S_# FORMAT 999COLUMN USERNAME FORMAT A9 HEADING "ORA USER"COLU ...

  3. 客户端用plsql进行中文条件查询时无结果的解决办法

    1.SELECT * FROM v$nls_parameters ; 查看NLS_CHARACTERSET 的值是多少,我的AL32UTF8- 查找客户机器的注册表,查找NLS_LANG的值,改成AL ...

  4. 【BZOJ3669】魔法森林(LCT)

    题意:有一张无向图,每条边有两个权值.求选取一些边使1和n连通,且max(a[i])+max(b[i])最小 2<=n<=50,000 0<=m<=100,000 1<= ...

  5. Linux下汇编语言学习笔记55 ---

    这是17年暑假学习Linux汇编语言的笔记记录,参考书目为清华大学出版社 Jeff Duntemann著 梁晓辉译<汇编语言基于Linux环境>的书,喜欢看原版书的同学可以看<Ass ...

  6. Ubuntu12.04之修改密码

    Ubuntu 12.04 默认root没有密码 修改密码方式如下: test@localhost:~$ sudo passwd root [sudo] password for test: 输入新的 ...

  7. Ubuntu12.04之SSH

    Ubuntu 12.04 关于SSH的知识 (1)安装完ubuntu系统12.04. (2)查看网络配置,输入命令ip addr后,显示有IP地址. (3)使用SSH终端工具Xshell连接系统,发现 ...

  8. 静态区间第k大(划分树)

    POJ 2104为例[经典划分树问题] 思想: 利用快速排序思想, 建树时将区间内的值与区间中值相比,小于则放入左子树,大于则放入右子树,如果相等则放入左子树直到放满区间一半. 查询时,在建树过程中利 ...

  9. Vue中-下拉框可以选择可以填写

    <el-form-item label="方法名称"> <el-autocomplete popper-class="my-autocomplete&q ...

  10. Office 连供打印机无法进纸怎么办 卡纸,塞纸怎么办

    我昨天打印还好好的,今天无法进纸了,哪怕只放一张纸,也是左边进去一点点,然后就塞住了,吸不下去了.   因为你的打印机里面有异物.你把连供拆掉(当心墨水流出来,把墨盒拆掉之后放高一点并用纸巾包住,不要 ...