慕课网4-2 编程练习:jQuery祖先后代选择器小案例
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祖先后代选择器小案例的更多相关文章
- 慕课网4-6 编程练习:jQuery后排兄弟选择器
4-6 编程练习 结合所学的兄弟选择器" ~ ",实现如下图所示效果: 任务 (1)使用兄弟选择器" ~ "将技术语言的背景色变成红色 (2)使用jQuery的 ...
- 慕课网 javascript深入浅出编程练习
任务 请在index.html文件中,编写arraysSimilar函数,实现判断传入的两个数组是否相似.具体需求: 1. 数组中的成员类型相同,顺序可以不同.例如[1, true] 与 [false ...
- Jquery广告浮动效果小案例
导入<script src="<%=path%>/html5/js/jquery.js"></script>文件 <SCRIPT type ...
- jQuery的DOM操作小案例
案例一:下拉列表左右选择 <body> <div> <select style="width:60px" multiple size="10 ...
- 【学】jQuery的源码思路1——后代选择器
jQuery的源码思路1--后代选择器 这里探讨一下jQuery中后代选择器的封装原理,并自己写一下 getEle('#div1 ul li .box');接受的参数就是个后代选择器,类似于这样: # ...
- [jQuery学习系列六]6-jQuery实际操作小案例
前言最后在这里po上jQuery的几个小案例. Jquery例子1_占位符使用需求: 点击第一个按钮后 自动去check 后面是否有按钮没有选中, 如有则提示错误消息. <html> &l ...
- jQuery基础---常规选择器
内容摘要: 1.简单选择器 2.进阶选择器 3.高级选择器 发文不易,转载请注明出处! jQuery 最核心的组成部分就是:选择器引擎.它继承了 CSS 的语法,可以对 DOM 元素的标签名.属性名. ...
- 第一百六十四节,jQuery,常规选择器
jQuery,常规选择器 学习要点: 1.简单选择器 2.进阶选择器 3.高级选择器 jQuery 最核心的组成部分就是:选择器引擎.它继承了 CSS 的语法,可以对 DOM 元 素的标签名.属性名. ...
- 慕课网2-5 编程练习:通过jQuery通配符选择器进行文字变色
2-5 编程练习 请请使用*选择器将div标签中的字体颜色变成红色 效果图: 任务 (1)使用通配符选择器 (2)使用jQuery的.css()方法设置样式,语法css('属性 '属性值') 参考代码 ...
随机推荐
- 添物不花钱学JavaEE(基础篇)-综述
JavaEE由一堆基础标准组成.JavaEE开发一般需要如下工具和掌握如下内容: Java环境 Eclipse或其他开发工具 Tomcat容器或类似软件 Jsp/Servlet/Web/JDBC的掌握 ...
- 找出消耗CPU最高的进程对应的SQL语句
COLUMN PID FORMAT 999COLUMN S_# FORMAT 999COLUMN USERNAME FORMAT A9 HEADING "ORA USER"COLU ...
- 客户端用plsql进行中文条件查询时无结果的解决办法
1.SELECT * FROM v$nls_parameters ; 查看NLS_CHARACTERSET 的值是多少,我的AL32UTF8- 查找客户机器的注册表,查找NLS_LANG的值,改成AL ...
- 【BZOJ3669】魔法森林(LCT)
题意:有一张无向图,每条边有两个权值.求选取一些边使1和n连通,且max(a[i])+max(b[i])最小 2<=n<=50,000 0<=m<=100,000 1<= ...
- Linux下汇编语言学习笔记55 ---
这是17年暑假学习Linux汇编语言的笔记记录,参考书目为清华大学出版社 Jeff Duntemann著 梁晓辉译<汇编语言基于Linux环境>的书,喜欢看原版书的同学可以看<Ass ...
- Ubuntu12.04之修改密码
Ubuntu 12.04 默认root没有密码 修改密码方式如下: test@localhost:~$ sudo passwd root [sudo] password for test: 输入新的 ...
- Ubuntu12.04之SSH
Ubuntu 12.04 关于SSH的知识 (1)安装完ubuntu系统12.04. (2)查看网络配置,输入命令ip addr后,显示有IP地址. (3)使用SSH终端工具Xshell连接系统,发现 ...
- 静态区间第k大(划分树)
POJ 2104为例[经典划分树问题] 思想: 利用快速排序思想, 建树时将区间内的值与区间中值相比,小于则放入左子树,大于则放入右子树,如果相等则放入左子树直到放满区间一半. 查询时,在建树过程中利 ...
- Vue中-下拉框可以选择可以填写
<el-form-item label="方法名称"> <el-autocomplete popper-class="my-autocomplete&q ...
- Office 连供打印机无法进纸怎么办 卡纸,塞纸怎么办
我昨天打印还好好的,今天无法进纸了,哪怕只放一张纸,也是左边进去一点点,然后就塞住了,吸不下去了. 因为你的打印机里面有异物.你把连供拆掉(当心墨水流出来,把墨盒拆掉之后放高一点并用纸巾包住,不要 ...