我们主要是通过attr去获取元素的属性：

看body内容：

<body>

		<p>

			账号：<input type="text" id="uname" value="张三" />

		</p>

		<p>

			密码：<input type="password" id="pwd" value="123456" />

		</p>

		<p>

			<input type="button" id="but" value="显示表单的信息" />

		</p>

	</body>

如果需要获取密码的type，我们就需要通过面的id去获取：

//获取密码

var pwd=$("#pwd");

//获取密码的type

var tp=pwd.attr("type");

获取密码的value的俩种方式：

//获取密码的value(获取的是默认值)

var val=pwd.attr("value");

//获取value的另一种方式(获取的是表单的实时值，用的更多)

var val2=pwd.val();

注意：这里获取value的俩种方式。对应的结果不同：

操作表单元素：

同样也可以用attr

$("#pwd").attr("type","text");
<!DOCTYPE html>

<html>

	<head>

		<meta charset="utf-8">

		<title>10jQuery中操作元素的属性</title>

		<script type="text/javascript" src="js/jquery-1.12.3.min.js" ></script>

		<script>

			$(function(){

				$("#but").click(function(){

					//获取密码

					var pwd=$("#pwd");

					//获取密码的type

					var tp=pwd.attr("type");

					//获取密码的value(获取的是默认值)

					var val=pwd.attr("value");

					//获取value的另一种方式(获取的是表单的实时值，用的更多)

					var val2=pwd.val();

					console.log(tp+"<--->"+val+"<--->"+val2)

					//操作表单元素

					$("#pwd").attr("type","text");

					alert("操作成功！")

				});

			})

		</script>

	</head>

	<body>

		<p>

			账号：<input type="text" id="uname" value="张三" />

		</p>

		<p>

			密码：<input type="password" id="pwd" value="123456" />

		</p>

		<p>

			<input type="button" id="but" value="显示表单的信息" />

		</p>

	</body>

</html>

获取元素对象属性：

俩种方式获取checked：

//第一种获取checked

var fav=$("#fav").attr("checked");

//第二种获取checked，如有则返回true，没有返回false

var fav=$("#fav").prop("checked");

由于第二种方式获取checked的返回值是布尔类型，因此我们可以通过这个方法去手动改变元素的默认值:

//通过这个将checked属性添加给表单元素

$("#fav1").prop("checked",true);

//通过这个将checked属性从表单元素中删除

$("#fav").prop("checked",false);

完整代码：

<!DOCTYPE html>

<html>

	<head>

		<meta charset="utf-8">

		<title>11jQuery中操作元素对象属性</title>

	</head>

	<body>

		<!DOCTYPE html>

<html>

	<head>

		<meta charset="utf-8">

		<title>10jQuery中操作元素的属性</title>

		<script type="text/javascript" src="js/jquery-1.12.3.min.js" ></script>

		<script>

			$(function(){

				$("#but").click(function(){

					//第一种获取checked

					var fav=$("#fav").attr("checked");

					//第二种获取checked，如有则返回true，没有返回false

					var fav=$("#fav").prop("checked");

					//通过这个将checked属性添加给表单元素

					$("#fav1").prop("checked",true);

					//通过这个将checked属性从表单元素中删除

					$("#fav").prop("checked",false);

					//alert(fav);

				})

			})

		</script>

	</head>

	<body>

		<p>

			账号：<input type="text" id="uname" value="张三" />

		</p>

		<p>

			密码：<input type="password" id="pwd" value="123456" />

		</p>

		<p>

			爱好：<input type="checkbox" name="" id="" value="" />抽烟

				<input type="checkbox" name="" id="fav" value="" checked="checked"/>喝酒

				<input type="checkbox" name="" id="fav1" value="" />烫头

		</p>

		<p>

			<input type="button" id="but" value="操作元素的属性" />

		</p>

	</body>

</html>

	</body>

</html>

JQuery中操作元素的属性_对象属性的更多相关文章

  1. JQuery中操作Css样式的方法

    JQuery中操作Css样式的方法//1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#tw ...

  2. 【转发】JQuery中操作Css样式的方法

    JQuery中操作Css样式的方法 //1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#t ...

  3. 区分元素特性attribute和对象属性property

    × 目录 [1]定义 [2]共有 [3]例外[4]特殊[5]自定义[6]混淆[7]总结 前面的话 其实attribute和property两个单词,翻译出来都是属性,但是<javascript高 ...

  4. js进阶 11-18 jquery中操作选择器的方法有哪些

    js进阶 11-18 jquery中操作选择器的方法有哪些 一.总结 一句话总结:add().addBack().end() 1.add()方法是干嘛的,举一例? 将add()方法后选择器选择的jqu ...

  5. Jquery中删除元素方法

    empty用来删除指定元素的子元素,remove用来删除元素,或者设定细化条件执行删除 语法: empty() remove(expr); empty用来删除指定元素的子元素,remove用来删除元素 ...

  6. 如何在js或者jquery中操作EL表达式的一个List集合

    ------------吾亦无他,唯手熟尔,谦卑若愚,好学若饥------------- 先说明此篇博客看明白了可以干嘛: 就是在js或者jquery中操作一个EL表达式的一个list集合或者复杂类型 ...

  7. python-类属性和对象属性(转)

    class People(object): # 类属性是指定义在类的内部而且在方法的外部的属性 money = 10000 def __init__(self,name,age,gender=1): ...

  8. python类属性和对象属性、类的普通方法和静态方法

    类属性和对象属性的定义 class LearnClass(): #类属性 cls_attr = None def __init__(self,arg): #对象属性 self.obj_attr = a ...

  9. 锋利的jQuery读书笔记---jQuery中操作DOM

    一般来说,DOM的操作分为3个方面,即DOM Core.HTML-DOM和CSS-DOM jQuery中的DOM操作主要包括以下种类: 查找节点 查找元素节点 查找属性节点 创建节点 创建元素节点 创 ...

随机推荐

  1. 1011课堂小结 day21

    组合 什么是组合 组合指的是一个对象中的属性,是另一个对象. 为什么要使用组合 为了减少代码冗余 封装 什么是封装 封装指的是把一堆属性(特征与技能)封装到一个对象中 为什么要封装 封装的目的为了方便 ...

  2. Jenkins初体验-安装与部署服务

    一.概述 1.简介 在工作中接触到CD/CI,Devops相关的技术,本文记录Jenkins的基本使用.Jenkins是一款开源的持续集成工具,能够集成一套自动化部署任务. 目标 通过jenkins从 ...

  3. redis 底层数据结构

    简单动态字符串SDS 包含字符串长度,剩余可用长度,字符数组 用于Redis中所有的string存储 字典(map) 数组+链表形式,跟hashMap很像 链地址法解决hash冲突 rehash使用新 ...

  4. [java] 笔记 from黑马

    1. 关于String的创建.   PS:String的底层是用字节数组来实现的. 2.字符串常量池的笔记 具体指向是如下图的, 注意看0x666和0x999这两个地址. 3.原因如下: 4. 5. ...

  5. ansible-template

    template简介 template功能: 根据模板文件动态生成对应的配置文件 template文件必须存放于templates目录下,且命名为 .j2 结尾 ansible的template模板使 ...

  6. mysql初级了解

    mysql是一个关系型数据库系统,可以存放若干个数据库,每个数据库中 可以存放若干张表,每张表中可以存放若干条记录 基本代码: 1.查看数据库   show databases: 2.创建数据库    ...

  7. VLAN实验（2）Trunk接口

    1.选择1台S5700.2台S3700和4台pc机,并根据实验编址完成此拓扑图. 2.启动设备,检查设备的连通性: 由于现在我们还没有划分VLAN,这5台PC,还在同一个VLAN中,现在我们启动所有的 ...

  8. Spring基于注解的配置1——@Required、@Autowired、@Qualifier示例及与传统注入方法的对比

    @Required注释 作用:用于属性的set方法,那么这个属性必须在xml文件的bean标签里面进行配置,否则就会抛出一个BeanInitializationException异常. 首先准备一个类 ...

  9. SSH 免密登录服务器

    本文详解如何以多种方法实现ssh免密码登陆远程服务器 阅读须知: 1.以下方法操作时请不要随意切换目录. 2.xxx为私钥,xxx.pub是公钥(默认一般文件名为id_rsa和id_rsa.pub,可 ...

  10. SpringBoot学习（六）—— springboot快速整合RabbitMQ

    目录 Rabbit MQ消息队列 简介 Rabbit MQ工作模式 交换机模式 引入RabbitMQ队列 代码实战 Rabbit MQ消息队列 @ 简介 优点 erlang开发,并发能力强. 社区活跃 ...