jquery attr() 속성

JS에서 노드의 속성과 속성 값을 설정하면 setattribute(), 노드의 속성과 속성 값을 얻으면 getattribute(), jquery에서 하나의attr()로 모두 해결할 수 있습니다. 좋아요^^
jquery에서attr() 방법으로 요소 속성을 가져오고 설정합니다.attr는attribute(속성)의 줄임말로 jQuery DOM 작업에서attr(),attr()는 4개의 표현식이 자주 사용됩니다.
1.attr(속성명)//속성의 값을 얻습니다(첫 번째 일치하는 요소의 속성 값을 얻습니다.이 방법을 통해 첫 번째 일치하는 요소에서 속성의 값을 쉽게 얻을 수 있습니다.원소에 해당하는 속성이 없으면undefined로 되돌아갑니다.)
2. attr(속성 이름, 속성 값)//속성 값을 설정합니다(일치하는 모든 요소에 속성 값을 설정합니다.)
3.attr(속성명, 함수값)//속성의 함수값을 설정합니다(일치하는 모든 요소에 계산된 속성값을 설정합니다.값을 제공하지 않고 함수를 제공하며 이 함수로 계산된 값을 속성값으로 합니다.)
4.attr(properties)//지정한 요소에 여러 개의 속성 값을 설정합니다. 즉, {속성 이름 1: "속성 값 1", 속성 이름 2: "속성 값 2",......}.(이것은 모든 일치하는 요소 중 많은 속성을 대량으로 설정하는 가장 좋은 방법입니다. 대상의class 속성을 설정하려면 'className' 을 속성 이름으로 사용해야 합니다. 또는 'class' 또는' id '를 직접 사용할 수 있습니다.)
<p title="        。">        ?</p>
<ul>
   <li title="   ">  </li>
   <li title="   " value="123">  </li>
   <li title="   ">  </li>
</ul>

1.attr(name)//      

1.1   attr(name)  title :
<script>
alert($("ul li:eq(1)").attr("title"));
</script>

  :   


1.2   attr(name)  value :
<script>
alert($("ul li:eq(1)").attr("value"));
</script>

  :123

2. attr(name,value)   //      

2.1   attr(name,value)  title  :    
<script>
$("ul li:eq(1)").attr("title","    ");
alert($("ul li:eq(1)").attr("title"));
</script>

  :    

3. attr(name,fn)  //        

3.1  value        title  。
<script>
$("ul li:eq(1)").attr("title",function(){ return this.value});
alert($("ul li:eq(1)").attr("title"));
</script>

  :123

4.attr(properties)  //   “ / ”                 

4.1   <ul>  2 <li>  title value  。
<script>
$("ul li:eq(1)").attr({title:"     ",value:"  123"});
alert($("ul li:eq(1)").attr("title"));
alert($("ul li:eq(1)").attr("value"));
</script>

  :         123

4.2   <ul>  2 <li>  class。
<script>
$("ul li:eq(1)").attr({className:"lili"});
</script>

  :   li html:<li class="lili" title="   " value="123">  </li>

4.3   <ul>  2 <li>  id。
<script>
$("ul li:eq(1)").attr({id:"lili"});
</script>

  :   li html:<li id="lili" title="   " value="123">  </li>

4.4   <ul>  2 <li>  style。
<script>
$("ul li:eq(1)").attr({style:"color:red"});
</script>

         ?

<script>
$("ul li:eq(1)").removeAttr ("title");
</script>

이렇게 간단하다.attr는 사실 원생 js에서 getattribute의 간소화 실현이고,removeAttr는removeAttribute의 약자이다.
------------------------------------------------------------------------------
Jquery attr 및 removeAttr의 간단한 사용
사용법 1: $(선택기).attr (속성 이름) 의 역할은 지정한 요소 ($(선택기) 부분의 지정한 속성의 값을 가져오는 것입니다.예:
html:

그러면 그림의 주소를 얻으려면 어떻게 해야 합니까?이렇게: $("img").attr ("src") 는 이렇게 간단합니다.alert나 다른 형식으로 출력하면 그림의 주소를 볼 수 있습니다.그럼 그림에 대한 설명을 얻어야 하나요?이렇게: $("img").attr(”alt”) .간단하죠.그것은 html 자체의 속성을 얻을 수 있을 뿐만 아니라, 네가 정의한 속성도 얻을 수 있다. 예를 들어 상례의funny 속성은 스스로 그것의 값을 얻을 수 있는지 없는지를 시험해 보자.주의: 가져오려는 속성이 존재하지 않으면, jquery는undefined로 되돌아옵니다.
사용법 2:$(선택기).attr (속성 이름, 속성 값) 의 역할은 모든 일치하는 요소에 속성 값을 설정하는 것입니다.
만약 페이지에 이런 html이 한 무더기 있다면:

우리는 이런 jquery 코드를 씁니다: $("img").attr(”src”,”http://t.douban.com/lpic/s3791510.jpg"이렇게 위에 무의미한img라벨이 쌓여 있다.

이해하기 쉽죠.만약 우리가 그림의 높이를 설정하고 싶다면 $("img") 만 주십시오.attr(”height”,”300″) . 너비를 설정하려면 $("img").attr(”width”,”500″) . 이렇게 보면 아무런 문제가 없지만 여러 속성을 설정할 때 하나하나 이렇게 쓰는 것은 너무 번거롭다. 그러면 세 번째 사용법을 살펴보자.
사용법 3:$(선택기).attr (Map) 는 지정한 요소에 여러 개의 속성 값을 설정하는 것을 의미합니다. 맵이 무슨 뜻인지 중점적으로 봅시다.그것은 사실 이런 서열이다.
{속성 이름 1: "속성 값 1", 속성 이름 2: "속성 값 2",......}
그러면 나는 용법2의 예를 실현할 것이다. 이렇게 쓰면 된다.
$(“img”).attr({src:“http://t.douban.com/lpic/s3791510.jpg” , height: “300″ , width : “500″})
이상에서 우리는 속성 값을 얻고 속성 값을 설정하는 것을 배웠습니다. 그러면 어떻게 속성을 삭제합니까?
jquery에서 속성을 삭제하는 키워드는:removeAttr 주의 A는 대문자입니다.어떻게 쓰는지 보자.
마찬가지로 용법1의 html 코드로 그림의 고도 속성을 삭제하고 싶습니다. 그러면 이렇게 합니다.
$(“img”). removeAttr(“height”);
응, 이렇게 간단해.attr는 사실 원생 js에서 get Attribute의 간소화 실현이고,remove Attr는remove Attribute의 약자이다

좋은 웹페이지 즐겨찾기