获取指定的class元素或者判断是否包含style

js中

获取指定的class元素或者判断是否包含style

1、获取是否含有指定的class:

$('#test').hasClass('ico_open')


其中#test为同一级别的div的class,icon为后面的class

例如:<span id="test" title="" treenode_ico="" class="ico_open" style=""></span>

判断时候用if,如果包含的话,返回true



2、判断是否包含style属性

if($(".class").attr("style")){
 //存在
}
解释:
1、$(".class").attr("style")写在if条件里面:
如果$(".class").attr("style")不存在时,那在if里面返回的是undefind。
undefind就是表示不存在(空对象)的意思,不存在即表示false,如果存在,那返回的就是true,

但是在判断的时候if(..=="")为空
2、$(".class").attr("style")用一个变量接收时:
var _style=$(".class").attr("style");如果存在style属性,那_style就是style的具体的值,如果不存在,那_style就是undefind


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
详尽的前端笔记,包含html和css部分,由xmind8做的笔记。css部分:编写的位置 1.内联样式 将样式编写到标签的style属性 <p style="color:red;"></p> 这种样式只会对当前标签起作用,不能对样式进行复用,不方便后期维护,不推荐使用 2.内部样式表 将样式表编写到headstyle标签 <style type="text/css"></style> 使用内部样式表,进一步将表现和结构分离,可以同时为多个元素设置样式,方便后期的维护 3.外部样式表 将样式表编写到外部的CSS文件,然后通过link标签将外部文件引入 <link rel="stylesheet" type="text/css" href="文件的路径"/> 将样式编写到外部样式表,可以在不同的页面使用同一个样式表,完全将表现和结构分离,方便后期的维护,推荐使用的方式 编写的位置 1.内联样式 将样式编写到标签的style属性 <p style="color:red;"></p> 这种样式只会对当前标签起作用,不能对样式进行复用,不方便后期维护,不推荐使用 2.内部样式表 将样式表编写到headstyle标签 <style type="text/css"></style> 使用内部样式表,进一步将表现和结构分离,可以同时为多个元素设置样式,方便后期的维护 3.外部样式表 将样式表编写到外部的CSS文件,然后通过link标签将外部文件引入 <link rel="stylesheet" type="text/css" href="文件的路径"/> 将样式编写到外部样式表,可以在不同的页面使用同一个样式表,完全将表现和结构分离,方便后期的维护,推荐使用的方式 基本语法 选择器 通过选择器可以选页面的一组元素,然后为其设置样式 元素选择器 根据标签名,选页面指定元素 语法:标签名{ } 例子: div{} p{} h1{} id选择器 根据元素的id属性值选一个唯一的元素 语法:#id {} 例子: #box1{} #hello{} 类选择器 根据元素class属性值,选一组元素 语法:.class{} 例子: .hello{} .box{} 通配选择器 选页面的所有元素 语法:*{} 通配选择器的性能比较差,尽量避免使用 并集选择器 可以同时选符合多个选择器的元素 语法:选择器1,选择器2,选择器N{} 例子: div,p,#box,.hello{} 交集选择器 可以选满足多个条件的元素 语法:选择器1选择器2选择器N{} 例子:p.hello{} 后代元素选择器 选指定元素指定后代元素 语法:祖先元素 后代元素{} 例子: div span {} div p{} 子元素选择器 选指定元素指定元素 语法:父元素 > 子元素 {} 例子: div > span {} div > p{} 声明块 声明块实际上就是一个一个CSS声明 声明 每一个CSS声明都是一个样式,实际上就是一个名值对的结构 名和值之间使用:链接 :左边是样式的名字 :右边是样式的值 每一个声明以;结尾 例子 color:red; font-size:20px; 元素之间的关系 父元素 直接包含元素的的元素叫做父元素元素 直接被父元素包含元素叫做子元素 祖先元素 直接或间接包含后代元素元素叫做祖先元素,父元素也是祖先元素 后代元素 直接或间接被祖先元素包含元素叫后代元素,子元素也是后代元素 兄弟元素 拥有相同父元素元素叫做兄弟元素元素和内联元素元素元素会独占页面的一行,无论他的内容的多少 一般使用块元素对页面进行布局 常见的块元素 div p h1~h6 内联元素 内联元素只占用自身的大小,不会独占一行 内联元素也叫行内元素(inline) 一般内联元素都是用来为文本来设置效果 常见的内联 span a img 包裹规则 一般都是使用块元素去包裹内联元素,而不会使用内联去包裹块元素 a元素可以包含任意元素,除了a本身 p元素不能包含任何块元素 伪类和伪元素 伪类和伪元素用来表示元素所处的一个特殊的状态,或者是一个特殊的位置 :link 表示一个普通的链接(未访问过的链接) :visited 表示访问过的链接 :hover 鼠标移入的链接,也可以为其他元素设置hover :active 正在被点击的链接,也可以为其他元素设置active :focus 表示元素获取焦点的状态,一般用于文本框 ::selection 表示内容被选的状态 在火狐使用::-moz-selection来代替 :first-letter 表示第一个字符 :first-line 表示文字的第一行 :before 选元素的最前边 一般该伪类都会结合content一起使用,通过content可以向指定位置添加内容 :after 选元素的最后边 一般该伪类都会结合content一起使用,通过content可以向指定位置添加内容 属性选择器 根据元素属性选择指定元素 [属性名] 选取含有指定属性元素 [属性名="属性值"] 选取属性值等于指定值的元素 [属性名^="属性值"] 选取属性值以指定内容开头的元素 [属性名$="属性值"] 选取属性值以指定内容结尾的元素 [属性名*="属性值"] 选取属性包含指定内容的元素 兄弟元素选择器 选取后一个兄弟元素 前一个 + 后一个 选取后边所有的兄弟元素 前一个 ~ 后边所有 子元素的伪类 :first-child 寻找父元素的第一个子元素,在所有的子元素排序 :last-child 寻找父元素的最后一个子元素,在所有的子元素排序 :nth-child 寻找父元素指定位置子元素,在所有的子元素排序 例子 p:nth-child(3) 可以使用even,来找到偶数的子元素 可以使用odd,来找到奇数的子元素 :first-of-type 寻找指定类型的第一个子元素 :last-of-type 寻找指定类型的最后一个子元素 :nth-of-type 寻找指定类型指定元素 否定伪类 从一组元素将符合要求的元素剔除出去 语法: :not(选择器) 例子: .abc:not(div) HTML,超文本标记语言 负责页面的结构,定义出页面的各个组成部分 HTML是采用纯文本的形式的编写,采用HTML标签来标识出页面的不同部分 标签 成对出现 <标签名></标签名> 自结束标签 <标签名 /> 属性 通过属性可以设置标签的效果 属性需要定义在开始标签或这自结束标签 属性实际上是一组一组名值对结构 例子: <标签名 属性名="属性值" 属性名="属性值"></标签名> <标签名 属性名="属性值" 属性名="属性值" /> HTML页面的基本结构 常用标签 <html> 网页的根标签 一个页面有且只有一个根标签 网页的所有内容都需要写在html标签的内部 <head> 网页的头部 该标签的内容不会在网页直接显示 该标签用于帮助浏览器解析页面 子标签 <title> 用来设置网页的标题 默认会在浏览器的标题栏显示 搜索引擎检索网页时,会主要检索title的内容,它会影响到页面在搜索引擎的排名 <meta> 用来设置网页的元数据,比如网页使用的字符集 <meta charset="utf-8" /> 设置网页的关键字 <meta name="keywords" content="关键字,关键字,关键字,关键字"/> 设置网页的描述 <meta name="description" content="网页的描述"/> 请求的重定向 <meta http-equiv="refresh" content="秒数;url=地址" /> <body> 网页的主体 网页所有的可见部分都需要在body编写 <h1> ~ <h6> 标题标签 在html一共有六级标题 六级标题,h1最重要,h6最不重要,一般页面只会使用h1~h3 h1的重要性仅次于title,浏览器也会主要检索h1的内容,以判断页面的主要内容 一般一个页面只能写一个h1 <p> 段落标签 <br /> 换行标签 <hr /> 水平线标签 内联框架 可以向一个页面引入其他的外部页面 <iframe></iframe> 属性 src 外部页面的地址,可以使用相对路径 width和height 可以设置框架的宽度和高度 name 可以为内联框架指定一个名字 可以将该属性值设置为超链接的target属性的值 这样当点击超链接时,页面将会在相应的内联框架打开 内联框架的内容不会被搜索引擎所检索,所以开发尽量不要使用内联框架 超链接 可以使当前页面跳转到其他的页面 <a>链接的文字</a> 属性 href 指向链接跳转的目标地址,可以是一个相对路径 还可以是#id属性值,这样当点击超链接以后,将会跳转到当前页面的指定位置 可以使用mailto:来创建一个发送电子邮件的超链接 target 指定在哪个窗口打开链接 可选值 _self 默认值,默认在当前窗口打开链接 _blank 在新窗口打开链接 内联框架的name属性值 在指定的内联框架打开链接 注释 语法 <!-- 注释内容 --> 注释的内容不会在页面显示,但是会在源码显示,我们可以通过注释来说明网页的代码 也可以通过注释隐藏一些页面不想显示的内容 实体 在HTML页面一些特殊符号是不能直接使用,需要使用实体来代替这些特殊符号 实体也可以称为转义字符 实体的语法 &实体名; 常用的实体 空格   < < > > 版权符号 © 图片标签 <img /> 使用图片标签可以向页面引入一个外部图片 属性 src 指向一个外部图片的路径,可以使用相对路径 alt 指定一个在图片无法加载时对图片的描述 搜索引擎主要通过该属性来识别图片的内容 如果不写该属性则搜索引擎会对图片进行收录 width 设置图片的宽度 height 设置图片的高度 图片的格式 JPEG 颜色丰富的图片,如,照片 GIF 颜色单一,简单透明的图片,动态图 PNG 颜色丰富,复杂透明的图片 图片选择的原则 效果一致,用小的 效果不一致,用效果好的 相对路径 相对于当前资源所在的目录的路径 可以使用../返回一级目录,返回几级使用几个../ xHtml语法规范 1.HTML不区分大小写,但是尽量使用小写 2.HTML的注释不能嵌套 3.标签必须结构完整 要么成对出现 要么自结束标签 4.标签可以嵌套但是不能交叉嵌套 5.属性必须有值,且值必须加引号,单引号双引号都可以 文本标签 <em> 表示语气上的强调 <strong> 表示内容的重要性 <i> 表示单纯的斜体 <b> 表示单纯的加粗 <small> 表示细则一类的内容 <cite> 表示参考的内容,凡是加书名号的都可以使用cite <q> 短引用,行内引用 <blockquote> 长引用,块级引用 <sup> 上标 <sub> 下标 <del> 删除的内容 <ins> 插入的内容 <pre> 预格式标签,可以保留代码空格换行这些格式 <code> 表示程序代码 列表 无序列表 使用ul来创建一个无序列表,在列表使用li来表示一个列表项 无序列表使用符号作为项目符号 有序列表 使用ol来创建一个无序列表,在列表使用li来表示一个列表项 使用有序的序号作为项目符号 定义列表 列表相关的元素都是块元素,他们之间可以互相嵌套 去除项目符号 list-style:none
一开始的需求只是表头部分在滚动时能一直固定在头部,那关键要实现的就是让tr能定位。 首先想到的方法是给tr设置relative,用ie6/7测试以下代码: Code 1 2 3 4 给tr设置relative后就能相对table定位了,看来很简单啊,但问题是这个方法ie8和ff都无效,而且存在很多问题,所以很快就被抛弃了。 ps:该效果用来做tr的拖动会很方便。 接着想到的是给table插入一个新tr,克隆原来的tr,并设置这个tr为fixed(ie6为absolute),例如: Code 1 2 3 4 5 6 第一个问题是fixed的tr在ie7不能进行定位,而且td在定位后并不能保持在表格的布局,这样在原表格插tr就没意义了。 ps:fixed的相关应用可参考仿LightBox效果。 最后我用的方法是新建一个table,并把源tr克隆到新table,然后通过对新table定位来实现效果。 用这个方法关键有两点,首先要做一个仿真度尽可能高的tr,还有是要准确的定位,这些请看后面的程序说明。 程序说明 【克隆table】 克隆一个元素用cloneNode就可以了,它有一个bool参数,表示克隆是否包含子节点。 程序第一步就是克隆原table: this._oTable = $(table);//源table this._nTable = this._oTable.cloneNode(false);//新table this._nTable.id = "";//避免id冲突 要注意虽然ie的cloneNode参数是可选的(默认是false),但在ff是必须的,建议使用时都写上参数。 还要注意的是id属性也会被克隆,也就是克隆后会有两个相同id的元素(如果克隆对象有设置的话),这很容易会导致其他问题,程序会把克隆table的id属性设空。 ps:table请用class来绑定样式,用id的话新table就获取不了样式了。 克隆之后再设置样式: this._style.width = this._oTable.offsetWidth + "px"; this._style.position = isIE6 ? "absolute" : "fixed"; this._style.zIndex = 100; 一般来说offsetWidth是width+padding+border的结果,但table比较特别,测试下面的代码: Code <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tra
要判断元素是否具有指定的CSS样式,您可以使用Java的Selenium WebDriver和ExpectedConditions类的`attributeContains`方法。以下是一个示例代码: ```java import org.openqa.selenium.By; import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement; import org.openqa.selenium.chrome.ChromeDriver; import org.openqa.selenium.support.ui.ExpectedConditions; import org.openqa.selenium.support.ui.WebDriverWait; public class ElementCSSStyleCheck { public static void main(String[] args) { // 设置驱动程序路径 System.setProperty("webdriver.chrome.driver", "path/to/chromedriver"); // 初始化ChromeDriver实例 WebDriver driver = new ChromeDriver(); // 打开网页 driver.get("https://example.com"); // 等待元素加载完成 WebDriverWait wait = new WebDriverWait(driver, 10); WebElement element = wait.until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector("your-selector"))); // 获取元素的CSS样式 String cssValue = element.getCssValue("your-css-property"); // 判断CSS样式是否包含指定的值 if (cssValue.contains("your-value")) { System.out.println("Element has the specified CSS style."); } else { System.out.println("Element does not have the specified CSS style."); } // 关闭浏览器 driver.quit(); } } ``` 请将代码的`"path/to/chromedriver"`替换为您本地ChromeDriver的路径,`"https://example.com"`替换为您要访问的网页URL,`"your-selector"`替换为您要查找的元素的CSS选择器,`"your-css-property"`替换为您要检查的CSS属性名称,`"your-value"`替换为您要检查的CSS属性值。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值