属性操作
<input type=”text” class=”apple” id=”username” name=”username” value=”tom” address=”beijing” />
itnode.属性名称
itnode.属性名称= 值;
itnode.getAttribute(属性名称);
itnode.setAttribute(属性名称,值);
jquery方式操作属性(attribute):
$().attr(属性名称); //获得属性信息值
$().attr(属性名称,值); //设置属性的信息
$().removeAttr(属性名称); //删除属性
$().attr(json对象); //同时为多个属性设置信息值,json对象的键值对就是名称和值
$().attr(属性名称,fn); //通过fn函数执行的return返回值对属性进行赋值
/**********************************************************************/
<script type="text/javascript">
function f1(){ //获得属性信息 console.log($("#username").attr('type')); console.log($("#username").attr('class')); console.log($("#username").attr('id')); console.log($("#username").attr('name')); console.log($("#username").attr('value')); console.log($("#username").attr('address')); } function f2(){ //修改属性 $('#username').attr('class','orange'); $('#username').attr('name','email'); $('#username').attr('value','jim@163.com'); $('#username').attr('address','shanghai'); $('#username').attr('weight','120');//新属性 //$('#username').attr('type','radio'); //禁止修改 $('#username').attr('id','email123'); }function f3(){
//批量修改属性 //$().attr(json对象); var jn = {name:'tel','class':'pear',value:'132787323728',address:'沈阳'} $('#username').attr(jn); }function f4(){
//函数返回值设置属性 $('#username').attr('value',function(){ return 10+30; }); }function f5(){
//删除属性 $('#username').removeAttr('class'); $('#username').removeAttr('name'); $('#username').removeAttr('value'); $('#username').removeAttr('address'); $('#username').removeAttr('id'); //$('#username').removeAttr('type'); //禁止删除 } </script> </head> <body> <h1>属性操作</h1> <input type="text" class="apple" id="username" name="username" value="tom" address="beijing" /> <input type="button" value="获取" οnclick="f1()" /> <input type="button" value="设置" οnclick="f2()" /> <input type="button" value="批量修改" οnclick="f3()" /> <input type="button" value="函数修改" οnclick="f4()" /> <input type="button" value="删除属性" οnclick="f5()" /> </body>/**********************************************************************/