JQuery 学习笔记 element属性控制


Posted in Javascript onJuly 23, 2009
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<script src="js/jquery-1.3.2.js" ></script> 
<script type="text/javascript"><!-- 
    $(function(){ 
             $("#aAttr1").click(function(){ 
                    $(    ":text").attr("value",$("#divTest").attr("id"));                 
                }) 
             $("#aAttr2").click(function(){ 
                    $(    ":text").attr("value",function(){ 
                                                             return $("#divTest").attr("id");         
                                                     });                 
                }) 
             $("#aAttr3").click(function(){ 
                    $(    ":text").attr({value:"test2"}); 
                }) 
             $("#aAttr4").click(function(){ 
                    $("#inputTest2").removeAttr("value");     
                })     }) 
// --></script> 
<title>无标题文档</title> 
</head> 
<body> 
<form> 
<input id="inputTest1" type="text" /> 
<input id="inputTest2" type="text" value="test" /> 
<div id="divTest">123</div> 
<a href="#" id="aAttr1">在text表单中显示DIV的ID方法1</a>| 
<a href="#" id="aAttr2">在text表单中显示DIV的ID方法2</a>| 
<a href="#" id="aAttr3">在text表单中显示test2</a>| 
<a href="#" id="aAttr4">去除inputTest2的value属性</a>| 
<input type="reset" /> 
</form> 
</body> 
</html>

1.element.attr(name)
描述:用于获取某个元素的name属性值,如例子中 $("#divTest").attr("id")就可获取divTest的ID值。
2.element.attr(name,value)
描述:用于设置某个元素的name属性值,如例子中$(":text").attr("value",$("#divTest").attr("id"))就将divTest的ID值赋于text表单的value值。
注:例子中(":text")用于获取input表单type为text的元素,同样其它表单也可用同样的方法获取,如<input type="button"/>即可用$(":button")进行获取,其返回值为Array(Element),也可用$(":input")获取所有的input元素。。在JQuery中要获取和设置元素的text与value值还可以使用element.text()/element.text(value)、element.val()/element.val(Value),用法与element.html()一样,若有疑问可以跟帖,我再做说明

3.element.attr(name,function)
描述:用于设置某个元素的name属性值与上一个类似,只是这里的value可以写成个function,更为灵活。
4.element.remove(name);
描述:用于删除某个元素的name属性。

Javascript 相关文章推荐
JavaScript 组件之旅(四):测试 JavaScript 组件
Oct 28 Javascript
jquery下动态显示jqGrid以及jqGrid的属性设置容易出现问题的解决方法
Oct 22 Javascript
javascript开发技术大全-第3章 js数据类型
Jul 03 Javascript
contains和compareDocumentPosition 方法来确定是否HTML节点间的关系
Sep 13 Javascript
jquery改变disabled的boolean状态的三种方法
Dec 13 Javascript
Jquery异步提交表单代码分享
Mar 26 Javascript
浅谈Node.js中的定时器
Jun 18 Javascript
使用BootStrap实现表格隔行变色及hover变色并在需要时出现滚动条
Jan 04 Javascript
JavaScript代码实现txt文件的上传预览功能
Mar 27 Javascript
微信小程序 搜索框组件代码实例
Sep 06 Javascript
layui form.render('select', 'test2') 更新渲染的方法
Sep 27 Javascript
vue实现点击按钮“查看详情”弹窗展示详情列表操作
Sep 09 Javascript
JQuery 学习笔记 选择器之六
Jul 23 #Javascript
JQuery 学习笔记 选择器之五
Jul 23 #Javascript
JQuery 学习笔记 选择器之四
Jul 23 #Javascript
JQuery 学习笔记 选择器之三
Jul 23 #Javascript
JQuery 学习笔记 选择器之二
Jul 23 #Javascript
JQuery 学习笔记 选择器之一
Jul 23 #Javascript
javascript IFrame 强制刷新代码
Jul 23 #Javascript
You might like
php discuz 主题表和回帖表的设计
2009/03/13 PHP
php中取得URL的根域名的代码
2011/03/23 PHP
php支付宝APP支付功能
2020/07/29 PHP
Laravel 6 将新增为指定队列任务设置中间件的功能
2019/08/06 PHP
实用javaScript技术-屏蔽类
2006/08/15 Javascript
CSDN轮换广告图片轮换效果
2007/03/27 Javascript
AngularJS实现表单验证
2015/01/28 Javascript
JS遍历数组及打印数组实例分析
2016/01/21 Javascript
JS判断字符串字节数并截取长度的方法
2016/03/05 Javascript
用jquery获取自定义的标签属性的值简单实例
2016/09/17 Javascript
jQuery实现判断控件是否显示的方法
2017/01/11 Javascript
Angular6 发送手机验证码按钮倒计时效果实现方法
2019/01/08 Javascript
vue 左滑删除功能的示例代码
2019/01/28 Javascript
laravel实现中文和英语互相切换的例子
2019/09/30 Javascript
24个解决实际问题的ES6代码片段(小结)
2020/02/02 Javascript
vue页面跳转实现页面缓存操作
2020/07/22 Javascript
[10:39]DOTA2上海特级锦标赛音乐会纪录片
2016/03/21 DOTA
[01:04:14]VP vs TNC 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/20 DOTA
[45:32]Liquid vs LGD 2018国际邀请赛淘汰赛BO3 第二场 8.23
2018/08/24 DOTA
在Python中使用元类的教程
2015/04/28 Python
python3实现ftp服务功能(客户端)
2017/03/24 Python
python实现员工管理系统
2018/01/11 Python
numpy中的delete删除数组整行和整列的实例
2018/05/09 Python
python opencv实现图片旋转矩形分割
2018/07/26 Python
python实现在列表中查找某个元素的下标示例
2020/11/16 Python
python自动生成sql语句的脚本
2021/02/24 Python
分享CSS3制作卡片式图片的方法
2016/07/08 HTML / CSS
检测浏览器对HTML5和CSS3支持度的方法
2015/06/25 HTML / CSS
英国简约舒适女装品牌:Great Plains
2018/07/27 全球购物
美国家居装饰和豪华家具购物网站:One Kings Lane
2018/12/24 全球购物
物流专业毕业生推荐信范文
2013/11/18 职场文书
志愿者事迹材料
2014/12/26 职场文书
详解Oracle块修改跟踪功能
2021/11/07 Oracle
python绘制简单直方图(质量分布图)的方法
2022/04/21 Python