jquery的attr

2020-12-30 17:33:21 浏览数 (1)

  1. 设置属性的值
代码语言:javascript复制
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("button").click(function(){
    $("img").attr({width:"50",height:"80"});//设置多个属性
    //$("img").attr("width","180");设置一个属性
  });
});
</script>
</head>
<body>
<img src="/i/eg_smile.gif" />
<br />
<button>设置图像的 width 和 height 属性</button>
</body>
</html>

小彩蛋: 设置属性的值还可以使用CSS()方法,如:

代码语言:javascript复制
$(document).ready(function(){
  $("button").click(function(){
    $("p").css({width:"50",height:"80"});
  });
});

该方法和上面的效果一样。


2. 获取属性的值

代码语言:javascript复制
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("button").click(function(){
    alert("Image width "   $("img").attr("width"));
  });
});
</script>
</head>
<body>
<img src="/i/eg_smile.gif" width="128" height="128" />
<br />
<button>返回图像的宽度</button>
</body>
</html>

总结: $(selector).attr(attribute,value) 若value不为空则设置该selector的属性;若value为空则获取该selector的属性值。

0 人点赞