>웹 프론트엔드 >JS 튜토리얼 >jquery는 사용자 정의 속성(attr 및 prop)을 가져옵니다.

jquery는 사용자 정의 속성(attr 및 prop)을 가져옵니다.

WBOY
WBOY원래의
2016-05-16 17:36:031691검색

$("form").attr("check"); $("form").prop("check"); 둘 다 허용되지만 새 버전의 jquery에서는 둘 다 좋습니다. 거의 동일합니다. 제가 찾은 유일한 차이점은 확인란을 사용할 때 prop을 사용해야 한다는 것입니다. 그렇지 않으면 IE 브라우저가 호환되지 않습니다.

코드 복사 코드는 다음과 같습니다.

head runat="server">




< ;script>
// var J = $("div[lang]").get()
// Alert($("[data-url]:eq(2)").attr( "data-url"));
$("[data-url]").each(function () {
alert($(this).attr("data-url")); }) ;
// $("[data-url]").each(function () {
// Alert($(this).prop("data-url")); // });



첨부: jquery attr() 메소드
attr() 메소드는 jquery에서 요소 속성을 가져오고 설정하는 데 사용됩니다. attr은 attribute의 약어입니다. attr()은 jQuery DOM 작업에 자주 사용됩니다. attr()에는 4개의 표현식이 있습니다.


1.
attr(
속성 이름)
//속성 값 가져오기(첫 번째 일치하는 요소의 속성 값 가져오기. 이 방법은 첫 번째 일치부터 쉽게 시작할 수 있습니다. 요소 요소의 속성 값을 가져옵니다. 요소에 해당 속성이 없으면 정의되지 않은 값이 반환됩니다.

2. attr(속성 이름, 속성 값) //속성 값을 설정합니다. (일치하는 모든 요소에 대해 속성 값을 설정합니다.)

3. attr(속성 이름,함수 값

)

//속성의 함수 값 설정(일치하는 모든 요소에 대해 계산된 속성 값 설정) .값을 제공하는 대신 함수를 제공하고, 이 함수로 계산된 값을 속성값으로 사용합니다. 4.attr(properties) //지정된 요소에 대해 여러 속성 값을 설정합니다. 즉, {속성 이름 1: "속성 값 1", 속성 이름 2: "속성 값 2”, … … }. (이것은 일치하는 모든 요소에 걸쳐 많은 속성을 일괄적으로 설정하는 가장 좋은 방법입니다. 객체의 클래스 속성을 설정하려면 'className'을 속성 이름으로 사용해야 합니다. 또는 'class'를 직접 사용할 수 있습니다. 또는 '아이디' )

샘플 코드:

코드 복사

코드는 다음과 같습니다. 🎜>< ;html xmlns="http://www.w3.org/1999/xhtml"> jquery

>< ;body>

가장 좋아하는 과일은 무엇인가요?


  • 사과


  • 파인애플


<script>... <BR>< /script> <BR></body> <BR><html><BR><BR><BR><BR>1.attr(name)//속성 값 가져오기<BR><BR> <BR><BR>1.1 attr(name)을 사용하여 제목 값을 가져옵니다. <BR><BR> </script>

코드 복사

코드는 다음과 같습니다.

<script> $(" ul li:eq(1)").attr("title")); <span></script>
결과:
jquery는 사용자 정의 속성(attr 및 prop)을 가져옵니다.

1.2 attr(name)을 사용하여 대체 값을 가져옵니다.

코드 복사 코드는 다음과 같습니다. 다음과 같습니다:

<script> <br>alert($("ul li:eq(1)").attr("alt")) <br></script>

결과:
jquery는 사용자 정의 속성(attr 및 prop)을 가져옵니다.

2. attr(name,value) //속성 값 설정


2.1 제목 값을 수정하려면 attr(name,value)을 사용하세요. to: 오렌지 먹지 마세요
코드 복사 코드는 다음과 같습니다.

<script> <br>$ ("ul li:eq(1)").attr("title","오렌지 먹지 마세요") <br>alert($("ul li:eq(1) )").attr("title")) ; <br></script>

결과:
jquery는 사용자 정의 속성(attr 및 prop)을 가져옵니다.

3. attr(name,fn) //속성 함수 값 설정

3.1 alt 속성 값을 title 속성 값으로 설정합니다.
코드 복사 코드는 다음과 같습니다.

<script> >$( "ul li:eq(1)").attr("title",function(){ return this.alt}) <br>alert($("ul li:eq(1)").attr ("제목")); <br></script>

결과:

jquery는 사용자 정의 속성(attr 및 prop)을 가져옵니다.

4.attr(properties) //"이름/값" 형태의 객체를 일치하는 모든 요소의 속성으로 설정


4.1 Get 는 제목과 대체 속성을 설정합니다.
코드 복사 코드는 다음과 같습니다.
<script> >$( "ul li:eq(1)").attr({title:"오렌지 주스를 마시지 마세요",alt:"Not 123"}) <br>alert($("ul li:eq( 1)").attr("제목")); <br>alert($("ul li:eq(1)").attr("alt")); <br></script>


결과:


jquery는 사용자 정의 속성(attr 및 prop)을 가져옵니다.jquery는 사용자 정의 속성(attr 및 prop)을 가져옵니다.

4.2
    에서 두 번째
  • 설정 수업을 받으세요.

    <script> >$( "ul li:eq(1)").attr({className:"lili"}) <div class="codebody" id="code37801"></script>


    결과:


jquery는 사용자 정의 속성(attr 및 prop)을 가져옵니다.4.3
    에서 두 번째
  • 의 설정 ID를 가져옵니다.


    코드 복사 코드는 다음과 같습니다.<script> >$( "ul li:eq(1)").attr({id:"lili"}) </div></script>


    결과:


    4.4
      에서 두 번째
    • 를 가져와서 스타일을 설정합니다. jquery는 사용자 정의 속성(attr 및 prop)을 가져옵니다.


      코드 복사
      코드는 다음과 같습니다.<script> >$( "ul li:eq(1)").attr({style:"color:red"}) </span></script>

      결과: jquery는 사용자 정의 속성(attr 및 prop)을 가져옵니다.

      li에 alt를 추가하는 것은 잘못되었습니다. img, 영역 및 입력 요소(애플릿 요소 포함)에서만 사용할 수 있습니다. 입력 요소의 경우 alt 속성은 제출 버튼 이미지를 대체하기 위한 것입니다. 여기서는 attr() 메소드를 자세히 설명하기 위해 적합한 속성이 없으므로 alt를 예시로 사용합니다. attr() 메소드 사용법을 학습하고 참고하기 위한 용도로만 사용됩니다.
      alt와 tite의 차이점은 다음과 같습니다.
      alt: 그래픽을 설명하는 데 사용되는 텍스트입니다. 이미지를 표시할 수 없는 경우 이미지 대신 이러한 텍스트가 표시됩니다. 마우스를 이미지 위로 이동하면 텍스트도 표시됩니다.
      제목 : 마우스를 올렸을 때 표시되는 텍스트입니다.

      그럼 어떻게 속성을 삭제하나요?

      jquery에서 속성을 삭제하는 키워드는 다음과 같습니다. RemoveAttr A는 대문자로 표시됩니다. 사용 방법을 확인하세요.

      사용법과 같은 html 코드에서 li의 title 속성을 삭제하고 싶어서 이렇게 합니다.

      코드 복사 코드는 다음과 같습니다.