博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
jQuery之属性操作
阅读量:4971 次
发布时间:2019-06-12

本文共 2309 字,大约阅读时间需要 7 分钟。

jQuery

属性操作

1)属性2)CSS 类3)HTML代码/文本/值

1.属性

(1)attr(name|properties|key,value|fn)

设置或返回被选元素的属性值。 name:属性名称 properties:作为属性的“名/值对”对象 key,value:属性名称,属性值 key,function(index, attr): 1:属性名称。 2:返回属性值的函数,第一个参数为当前元素的索引值,第二个参数为原先的属性值。

(2)removeAttr(name)

从每一个匹配的元素中删除一个属性name:要删除的属性名.将文档中图像的src属性删除HTML 代码:jQuery 代码:$("img").removeAttr("src");结果:[  ]

(3)prop(name|properties|key,value|fn)

获取在匹配的元素集中的第一个元素的属性值。参数name 描述:选中复选框为true,没选中为falsejQuery 代码:$("input[type='checkbox']").prop("checked");参数properties 描述:禁用页面上的所有复选框。jQuery 代码:$("input[type='checkbox']").prop({  disabled: true});参数key,value 描述:禁用和选中所有页面上的复选框。jQuery 代码:$("input[type='checkbox']").prop("disabled", false);$("input[type='checkbox']").prop("checked", true);通过函数来设置所有页面上的复选框被选中。jQuery 代码:$("input[type='checkbox']").prop("checked", function( i, val ) {  return !val;});

2.css类

(1)addClass(class|fn)

为每个匹配的元素添加指定的类名。给li加上不同的classHTML 代码:
  • Hello
  • Hello
  • Hello
jQuery 代码:$('ul li:last').addClass(function() { return 'item-' + $(this).index();});

(2)removeClass([class|fn])

从所有匹配的元素中删除全部或者指定的类。从匹配的元素中删除 'selected' 类jQuery 代码:$("p").removeClass("selected");删除匹配元素的所有类jQuery 代码:$("p").removeClass();删除最后一个元素上与前面重复的classjQuery 代码:$('li:last').removeClass(function() {    return $(this).prev().attr('class');});

(3)toggleClass(class|fn[,sw])

如果存在(不存在)就删除(添加)一个类。为匹配的元素切换 'selected' 类jQuery 代码:$("p").toggleClass("selected");每点击三下加上一次 'highlight' 类HTML 代码:jQuery 代码:jQuery 代码:var count = 0;$("p").click(function(){$(this).toggleClass("highlight", count++ % 3 == 0);});

3.HTML代码/文本/值

(1)html([val|fn])

取得第一个匹配元素的html内容。这个函数不能用于XML文档。但可以用于XHTML文档。返回p元素的内容。jQuery 代码:$('p').html();设置所有 p 元素的内容jQuery 代码:$("p").html("Hello world!");使用函数来设置所有匹配元素的内容。jQuery 代码:$("p").html(function(n){return "这个 p 元素的 index 是:" + n;});

(2)text([val|fn])

取得所有匹配元素的内容。返回p元素的文本内容。jQuery 代码:$('p').text();设置所有 p 元素的文本内容jQuery 代码:$("p").text("Hello world!");使用函数来设置所有匹配元素的文本内容。jQuery 代码:$("p").text(function(n){return "这个 p 元素的 index 是:" + n;});

(3)val([val|fn|arr])

获得匹配元素的当前值。设定一个select和一个多选的select的值HTML 代码:
check1 check2 radio1 radio2jQuery 代码:$("#single").val("Single2");$("#multiple").val(["Multiple2", "Multiple3"]);$("input").val(["check2", "radio1"]);

转载于:https://www.cnblogs.com/WWWrs/p/6857954.html

你可能感兴趣的文章
Git一分钟系列--快速安装git客户端
查看>>
bzoj 3160 万径人踪灭 —— FFT
查看>>
poj3254二进制放牛——状态压缩DP
查看>>
使用 ref 和 out 传递数组注意事项
查看>>
combobox和textbox中输入数据为非数字leave时的公用事件,只需要在控件的leave事件中选择本事件即可...
查看>>
纵越6省1市-重新启动
查看>>
hive安装以及hive on spark
查看>>
勇者无畏
查看>>
12864点阵液晶显示模块的原理和实例程序(HJ12864M-1)
查看>>
jz1074 【基础】寻找2的幂
查看>>
Wannafly模拟赛5 A 思维 D 暴力
查看>>
C#控制台程序实现鼠标左右手习惯切换
查看>>
C++ 继承、函数重载
查看>>
Javascript获取select下拉框选中的的值
查看>>
【Linux开发】CCS远程调试ARM,AM4378
查看>>
springmvc常用注解标签详解
查看>>
Linux之ssh服务介绍
查看>>
Java Swing提供的文件选择对话框 - JFileChooser
查看>>
排序:冒泡排序
查看>>
github下载安装
查看>>