Heim > Web-Frontend > js-Tutorial > Anwendungsbeispiele für die Methoden attr und removeAttr in JQuery_jquery

Anwendungsbeispiele für die Methoden attr und removeAttr in JQuery_jquery

WBOY
Freigeben: 2016-05-16 15:58:33
Original
1156 Leute haben es durchsucht

Die Beispiele in diesem Artikel beschreiben die Verwendung der attr-Methode und der removeAttr-Methode in JQuery. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

<!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" />
<title></title>
<style type="text/css">
div{width:100px;margin:0px auto;border:1px solid red;}
</style>
<script src="jquery-1.6.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
  $("#btnChange").click(function () {
    var $divs = $("div");
    //----1.举例1
    //$divs.eq(0).attr("MyAttr", "Ronaldo");
    //eq返回指定下标的JQuery对象(注意:此时$divs中有两个div的dom元素)
    //$divs.eq(1).attr("MyAttr", "Ronaldo1");
    //alert($divs.attr("MyAttr"));
    //读取MyAttr属性,注意,只会读取出第一个元素的该属性
    //----2.举例2  使用JSon格式设置attr
    //$divs.eq(0).attr({ "MyAttr": "Ronaldo", "Age": "19" });
    //$divs.eq(1).attr({ "MyAttr": "Rivaldo", "Age": "29" });
    //alert("MyAttr:" + $divs.eq(1).attr("MyAttr") + ",Age:" + $divs.eq(1).attr("Age"));
    //----3.举例3  移除属性
    $divs.eq(0).attr({ "MyAttr": "Ronaldo", "Age": "19" });
    $divs.eq(1).attr({ "MyAttr": "Rivaldo", "Age": "29" });
    alert("MyAttr:" + $divs.eq(1).attr("MyAttr") + ",Age:" + $divs.eq(1).attr("Age"));
    $divs.eq(1).removeAttr("Age");
    alert("MyAttr:" + $divs.eq(1).attr("MyAttr") + ",Age:" + $divs.eq(1).attr("Age"));
  });
});
</script>
</head>
<body>
<input id="btnChange" type="button" value="Click Me" />
<div id="div1">我是div1</div>
<div id="div2">我是div2</div>
</body>
</html>
Nach dem Login kopieren

Ich hoffe, dass dieser Artikel für alle bei der jQuery-Programmierung hilfreich sein wird.

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage