jq实现超级简单的隔行变色
文章地址:https://www.cnblogs.com/sandraryan/
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
p{
margin: 0;
line-height: 26px;
}
</style>
</head>
<body>
<p>this is a sentence.</p>
<p>this is a sentence.</p>
<p>this is a sentence.</p>
<p>this is a sentence.</p>
<p>this is a sentence.</p>
<p>this is a sentence.</p>
<p>this is a sentence.</p>
<p>this is a sentence.</p>
<p>this is a sentence.</p> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>
<script>
// p中的奇数行偶数行设置不同的颜色
$("p:odd").css("backgroundColor","white");
$("p:even").css("backgroundColor","lightblue"); </script>
</body>
</html>
jq实现超级简单的隔行变色的更多相关文章
- JS 一个简单的隔行变色函数
//输入要隔行变色的标签名 function setbgColor(tr){ var tr = document.getElementsByTagName("tr"); for(v ...
- 简单的css js控制table隔行变色
(1)用expression 鼠标滑过变色: <style type="text/css"><!-- table { background-color:#0000 ...
- 隔行变色---简单的css js控制table隔行变色
(1)用expression 鼠标滑过变色: <style type="text/css"><!-- table { background-color:#0000 ...
- [js插件开发教程]一步步开发一个可以定制配置的隔行变色小插件
隔行变色功能,不用js,直接用css伪类就可以做,这个实例可以作为js插件开发很好的入门级实例.本文实现的隔行变色包括以下功能: 1,支持2种常用结构共存( div元素 和 表格类型 ) 2,一个页面 ...
- JSP简单隔行变色和日期格式化
以前好像在找,都没找到简单点的,所以后面就自己写了一个,感觉超级简单又好理解,分享给大家 <%@ page language="java" import="java ...
- 表格的一些原生js操作(隔行变色,高亮显示,添加删除,搜索)
看着网上的视频教程,虽说还是有点简单,但还是不免想记录下.这些操作包括(隔行变色,高亮显示,添加删除,搜索功能),而这儿就是涉及table的原有属性“tBodies” “rows” “cells”等几 ...
- JQuery实现隔行变色和突出显示当前行 效果
运行效果如下图: jquery关键代码: <script type="text/javascript"> //该文件为:js.js // 当鼠标移到表格上是,当前一行背 ...
- jQuery选择器实现隔行变色和使用javaScript实现隔行变色
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <!--什么是选择器? jQuery选择器继承了 ...
- 我的第一个jQuery插件--表格隔行变色
虽然网上有大量的插件供我们去使用,但不一定有一款适合你的,必要的时候还是要自己动手去敲的.下面,开始我的第一个插件... 参考<锋利的JQuery>,JQuery为开发插件增设了俩个方法: ...
随机推荐
- jmeter 通过csv data set config 设置参数化后,执行结果显示为<EOF>
通过csv data set config 设置参数化后,执行结果显示为<EOF>: 反复确认相应的参数的设置均没有问题,其中csv文件编码方式采用uft-8.在csv data set ...
- Android——兼容性
两种类型的兼容性:设备兼容性和应用兼容性. 设备的Android兼容性就是app能够正确运行的Android执行环境(Android execution environment).Android执行环 ...
- java 4对象群体的组织
两个接口 collecion接口 元素构成的元素的群体 map接口 键值对组成的群体 Array类 Vector ArrayList 在数组上构建的类 Java集合框架介绍 集成过得数据结构 查询方法 ...
- Leetcode849.Maximize Distance to Closest Person到最近的人的最大距离
在一排座位( seats)中,1 代表有人坐在座位上,0 代表座位上是空的. 至少有一个空座位,且至少有一人坐在座位上. 亚历克斯希望坐在一个能够使他与离他最近的人之间的距离达到最大化的座位上. 返回 ...
- Spring_总结
spring配置Bean 配置形式 基于XML文件的方式 属性注入 构造注入 泛型依赖注入 基于注解的方式 配置方式 全类名(反射) 通过工厂方法 FactoryBean 字面值 <![CDAT ...
- 【JZOJ4763】【NOIP2016提高A组模拟9.7】旷野大计算
题目描述 输入 输出 样例输入 5 5 9 8 7 8 9 1 2 3 4 4 4 1 4 2 4 样例输出 9 8 8 16 16 数据范围 解法 离线莫队做法 考虑使用莫队,但由于在删数的时候难以 ...
- day13 memcache,redis上篇
memcache memcache简介 Memcached是一个自由开源的,高性能,分布式内存对象缓存系统. Memcached是以LiveJournal旗下Danga Interactive公司的B ...
- python Python程序的架构
- python 捕获异常
- 应用node-webkit(NWJS)把BS架构的网址封装成桌面应用
一.目的 给WEB应用的用户提供一款同一的浏览器,访问固定网址,封装一些常用插件(如flash插件等) 二.步骤 1.下载node-webkit,官方网址https://nwjs.io/ 2.解压下载 ...