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 相关文章推荐
JS 实现获取打开一个界面中输入的值
Mar 19 Javascript
jQuery选择器简明总结(含用法实例,一目了然)
Apr 25 Javascript
60行js代码实现俄罗斯方块
Mar 31 Javascript
jQuery实现仿QQ空间装扮预览图片的鼠标提示效果代码
Oct 30 Javascript
js利用正则表达式检验输入内容是否为网址
Jul 05 Javascript
AngularJS应用开发思维之依赖注入3
Aug 19 Javascript
JavaScript算法教程之sku(库存量单位)详解
Jun 29 Javascript
详解Vue文档中几个易忽视部分的剖析
Mar 24 Javascript
JavaScript函数式编程(Functional Programming)声明式与命令式实例分析
May 21 Javascript
Javascript实现鼠标移入方向感知
Jun 24 Javascript
浅谈vue中使用编辑器vue-quill-editor踩过的坑
Aug 03 Javascript
JavaScript Image对象实现原理实例解析
Aug 26 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
第十一节--重载
2006/11/16 PHP
PHP图像裁剪缩略裁切类源码及使用方法
2016/01/07 PHP
CI(CodeIgniter)框架实现图片上传的方法
2017/03/24 PHP
快速保存网页中所有图片的方法
2006/06/23 Javascript
基于Jquery+Ajax+Json的高效分页实现代码
2011/10/29 Javascript
深入理解JavaScript系列(11) 执行上下文(Execution Contexts)
2012/01/15 Javascript
使用javascript:将其它类型值转换成布尔类型值的解决方法详解
2013/05/07 Javascript
JavaScript Window浏览器对象模型方法与属性汇总
2015/04/20 Javascript
js实现的鼠标滚轮滚动切换页面效果(类似360默认页面滚动切换效果)
2016/01/27 Javascript
谈一谈bootstrap响应式布局
2016/05/23 Javascript
再谈Javascript中的异步以及如何异步
2016/08/19 Javascript
微信小程序 生命周期函数详解
2017/05/24 Javascript
JS失效 提示HTML1114: (UNICODE 字节顺序标记)的代码页 utf-8 覆盖(META 标记)的冲突的代码页 utf-8
2017/06/23 Javascript
jQuery Pagination分页插件_动力节点Java学院整理
2017/07/17 jQuery
js实现前端图片上传即时预览功能
2017/08/02 Javascript
vue 打包后的文件部署到express服务器上的方法
2017/08/09 Javascript
详解Vue-cli代理解决跨域问题
2017/09/27 Javascript
原生JS实现 MUI导航栏透明渐变效果
2017/11/07 Javascript
Vue异步组件处理路由组件加载状态的解决方案
2018/09/07 Javascript
vuex的module模块用法示例
2018/11/12 Javascript
Vue-cli3简单使用(图文步骤)
2019/04/30 Javascript
Vue this.$router.push(参数)实现页面跳转操作
2020/09/09 Javascript
[00:52]DOTA2齐天大圣预告片
2016/08/13 DOTA
python实现用户登陆邮件通知的方法
2015/07/09 Python
Python实现简单的文件传输与MySQL备份的脚本分享
2016/01/03 Python
Python判断列表是否已排序的各种方法及其性能分析
2016/06/20 Python
Python通过future处理并发问题
2017/10/17 Python
python 求定积分和不定积分示例
2019/11/20 Python
logging level级别介绍
2020/02/21 Python
请写出一段Python代码实现删除一个list里面的重复元素
2015/12/29 面试题
暑期社会实践方案
2014/02/05 职场文书
模具专业毕业生自荐书范文
2014/02/19 职场文书
小学开学典礼主持词
2014/03/19 职场文书
2015年党员承诺书
2015/01/21 职场文书
使用Redis实现实时排行榜功能
2021/07/02 Redis
一文了解JavaScript用Element Traversal新属性遍历子元素
2021/11/27 Javascript