JQuery笔记(四) 通用选择的尝试

  常用的一种格式是用LI存放列表,一行一般会放2个内容,如标题和时间等。但这两个内容可能用的标签会有所不同,有时可能是<a>和<span>,有时可能是2个<span>,或者别的组合。所以我想尝试能否写一种通用的css,一次定义好LI的2个子项的样式。我这样写的

$(".blk .con li :eq(0)").css({display:"inline-block","width":"310px",overflow:"hidden"});  
$(".blk .con li :eq(1)").css({display:"inline-block","width":"40px",overflow:"hidden","margin-left":"10px",border:"1px solid red"});  

结果只对第一行有效,换成别的

$(".blk .con li").children(0).css({display:"inline-block","width":"310px",overflow:"hidden"});
  //LI的第一部分:宽度
$(".blk .con li *:eq(0)").css({display:"inline-block","width":"310px",overflow:"hidden"});  
$(".blk .con li *").get(0).css({display:"inline-block","width":"310px",overflow:"hidden"});  

等都失败。只有这个通过:

$(".blk .con li a").css({display:"inline-block","width":"310px",overflow:"hidden",border:"1px solid red"});
  //LI的第一部分:宽度
$(".blk .con li span").css({display:"inline-block","width":"40px",overflow:"hidden","margin-left":"10px",border:"1px solid red"}); 

我想each应该也可以,但实在麻烦,还不如每次我自己改js。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏Java后端技术

Target runtime Apache Tomcat v6.0 is not defined.错误解决方法

  最近在使用本地的tomcat进行运行项目的时候,发现出现了如题所述的问题。不知道什么原因,经过努力解决了该问题。

791
来自专栏DeveWork

自定义WordPress 密码文章提示文字

WordPress 默认的密码提示文字是这样的:This post is password protected. To view it please enter...

3667
来自专栏CodingBlock

Android查缺补漏(View篇)--布局文件中的“@+id”和“@id”有什么区别?

Android布局文件中的“@+id”和“@id”有什么区别? +id表示为控件指定一个id(新增一个id),如: <cn.codingblock.view.c...

3158
来自专栏Jerry的SAP技术分享

SAP Fiori应用Footerbar区域按钮的高亮显示逻辑

如果您够细心,您或许会发现有的SAP Fiori应用的footerbar区域内的按钮有高亮显示,有的则没有。

1948
来自专栏九彩拼盘的叨叨叨

学习前端 第5周 第5天

1072
来自专栏WindCoder

基于zepto的微信手机端微场景HTML5页面特效

page处是管理图片的,在改div中添加删除图片及图片中的相关组件,如在div标签为page page-9中添加的Button组件。

2181
来自专栏SHERlocked93的前端小站

JS 回调模式

如果有个模块 findeNodes() ,任务是找到期望的 DOM 元素并使用 hide() 处理:

1131
来自专栏数据小魔方

Excel常用数据导入方法

今天给大家讲解Excel数据源的导入 ▽ excel支持的数据源类型有很多 今天只讲解常用的三种类型 Access文件、网页数据、文本数据 Access数据源导...

3017
来自专栏向治洪

微信小程序开发入门篇

本文档将带你一步步创建完成一个微信小程序,并可以在手机上体验该小程序的实际效果。 开发准备工作 获取微信小程序的 AppID 登录 https://mp.wei...

3926
来自专栏小尘哥的专栏

使用bootstrap-Validator校验表单

前端UI框架选择bootstrap,那么bootstrap-Validator作为表单校验是一个不错的选择。

1713

扫码关注云+社区

领取腾讯云代金券