Jquery属性操作、添加类
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="jquery.1.11.1.min.js"></script>
<style type="text/css">
.red{
color: red;
}
.box3{
width: 100px;
height: 100px;
background: red;
}
</style>
</head>
<body>
addClass() 添加类名
removeClass() 移除类名
toggleClass() 添加或移除类名,这个方法很灵活,很舒服
html() 无参数时获取内部html或者有参数设置内部html
text() 无参数时获取内部文本或者有参数设置内部文本
val() 获取或者设置表单元素的value
css() 获取或者设置css样式
一个字符串参数 获取
一个对象 设置
两个参数 设置
attr() 给普通标签设置或者获取属性
removeAttr() 移除属性
prop() 给表单元素设置和获取属性
data() 给JQ对象设置属性
offset 偏移值
<div id="box">box</div>
<div id="box1">
<span>span1</span><span>span2</span>
</div>
<div id="box2">111</div>
<div id="box100"></div>
<input type="text" name="" id="t">
<div class="box3"></div>
<script type="text/javascript">
//开始这样<div id="box100"></div>,
//添加属性后变成<div id="box100" name="zhangsan"></div>
$("#box100").attr("name","zhangsan");
$("[name=zhangsan]").html("123") //因为有属性了,所有可以赋值
$("#box").addClass("red").click(function(){
// $(this).removeClass("red");
//this指id名为box对应的标签, toggleClass()这个方法有类就删除类,没类就添加类,很灵活,很舒服
$(this).toggleClass("red");
});
$("#box1").html("<span>hello</span>"); //设了参数就替换了原来的值
$("#box2").text("<span>hello</span>"); //设了参数就替换了原来的值,标签名也会写上去
$("#t").val("happy"); //给表单赋值的
$("#t").change(function(){ //输入框内容发生改变时,鼠标一移开马上触发
alert(123)
})
$(".box3").css("background","#FFFF00"); //2个值设置宽度
$("#box").attr("index",0); //添加属性,2个参数添加属性,一个参数获得属性
$("#box").removeAttr("index"); //移除属性
</script>
</body>
</html>
Jquery属性操作、添加类的更多相关文章
- jQuery源代码学习之八——jQuery属性操作模块
一.jQuery属性模块整体介绍 jQuery的属性操作模块分四个部分:html属性操作,dom属性操作,类样式操作,和值操作. html属性操作(setAttribute/getAttribute) ...
- python全栈开发day48-jqurey自定义动画,jQuery属性操作,jQuery的文档操作,jQuery中的ajax
一.昨日内容回顾 1.jQuery初识 1).使用jQuery而非JS的六大理由 2).jQuery对象和js对象转换 3).jQuery的两大特点 4).jQuery的入口函数三大写法 5).jQu ...
- jquery——属性操作、特殊效果
1. attr().prop() 取出或者设置某个属性的值 <!DOCTYPE html> <html lang="en"> <head> &l ...
- JQuery --- 第二期 (jQuery属性操作)
个人学习笔记 1.JQuery的内容选择器 <!DOCTYPE html> <html lang="en"> <head> <meta c ...
- web前端----jQuery属性操作
知识点总结 1.属性 属性(如果你的选择器选出了多个对象,那么默认只会返回出第一个属性). attr(属性名|属性值) - 一个参数是获取属性的值,两个参数是设置属性值 - 点击加载图片示例 remo ...
- Jquery属性操作(入门二)
********JQuery属性相关的操作******** 1.属性 属性(如果你的选择器选出了多个对象,那么默认只会返回出第一个属性). attr(属性名|属性值) - 一个参数是获取属性的值,两个 ...
- 前端之JQuery:JQuery属性操作
Jquery2--属性相关的操作 知识点总结 1.属性 属性(如果你的选择器选出了多个对象,那么默认只会返回出第一个属性). attr(属性名|属性值) - 一个参数是获取属性的值,两个参数是设置属性 ...
- jQuery属性操作
jQuery 的属性操作的核心部分其实就是对底层 getAttribute().setAttributes()等方法的一系列兼容性处理 ...if ( notxml ) { name = name.t ...
- jQuery属性操作总结
jquery属性包括以下几个: attr(name|pro|key,val|fn) removeAttr(name) prop(n|p|k,v|f)1.6+ removeProp(name)1.6+ ...
随机推荐
- Latin-1字符集
ISO Latin-1字符集是Unicode字符集的一个子集,对应于IE4+中Unicode字符指令表的前256个条目.下面表格中详细提供了每个字符及字符的十进制编码和HTML已命名实体.其中Unic ...
- leetcode 0207
目录 ✅ 561. 数组拆分 I ✅ 1025. 除数博弈 聪明的数学归纳法: 动态规划又来了(没理解,todo 0207): ✅ 557. 反转字符串中的单词 III py 中的 字符 split ...
- 电源适配器DC插头规格
电源适配器 DC 插头的内径外径规格有 (单位为 MM) :2.0*0.72.35*0.72.35*1.12.5*0.73.5*1.13.5*1.354.0*1.75.5*2.15.5*2.54.75 ...
- 用apt-get解决dpkg过程中出现的依赖问题
dpkg命令不解决依赖问题,这点对新手很不友好 当使用dpkg -i *.deb 安装出现依赖问题的时候,可以尝试如下解决方法: apt-get -f -y install # 复制粘贴回车,inst ...
- Linux 命令中 which、whereis、locate 命令的用法
which 命令 which 命令的作用是,在 PATH 变量指定的路径中搜索可执行文件的所在位置.它一般用来确认系统中是否安装了指定的软件. (1)命令格式 which 可执行文件名称 wherei ...
- linux修改文件的权限和修改文件所有者和所属组
文件设定法:chmod [who] [+][-][=] [mode] who 文件所有者:u 文件所属组:g 其他:o 所有人:a + 添加权限 - 减少权限 = 覆盖原来权限 权 ...
- vue通过get方法下载java服务器excel模板
vue方法 handleDownTemplateXls(fileName){ if(!fileName || typeof fileName != "string"){ fileN ...
- Centos7 [ubuntu] 安装pycharm2019.1.3并永久破解教程
一.安装pycharm2019专业版并激活步骤 1.拉取安装包 # wget https://download.jetbrains.com/python/pycharm-professional- ...
- Redis数据库在windows系统下的安装及使用
1.下载 Redis官方是不支持windows的,但是Microsoft Open Tech group 在 GitHub上开发了一个Win64的版本,下载地址:https://github.com/ ...
- 关于java自学的内容以及感受(7.21)
直接切入正题说一下自学到的内容: 定义合法标识符的规则: 可以由英文字母,数字,_,$组成. 不能数字开头和包含空格. 不可以使用关键字和保留字,但是可以包含关键字和保留字. byte short i ...