복붙노트

[JQUERY] 의 jQuery .DATA ()는 않습니다) (하지 작동하지만 .attr을한다

JQUERY

의 jQuery .DATA ()는 않습니다) (하지 작동하지만 .attr을한다

해결법


  1. 1..DATA ()와 HTML5의 데이터 속성에 대한 .attr ( '데이터 이름')와 함께 작업 할 때 나는 며칠 전 비슷한 "버그"에 달렸다.

    .DATA ()와 HTML5의 데이터 속성에 대한 .attr ( '데이터 이름')와 함께 작업 할 때 나는 며칠 전 비슷한 "버그"에 달렸다.

    당신이 설명하는 동작은 버그가 아니라 의도적으로 설계된 동작입니다.

    .DATA () 호출은 특별하다 -뿐만 아니라 그것은 HTML5 데이터를 검색 않습니다 그것은 또한 / 평가 속성을 구문 분석하는 시도를 속성. 그래서 데이터 myjson 같은 속성을 가진 = '{ "안녕하세요": "세계"}'검색을 통해 .attr () 문자열을 반환합니다 동안 (.DATA를 통해 검색) 개체를 반환합니다. jsfiddle 예를 참조하십시오.

    .DATA ()가 추가 처리 jQuery를 저장에게 $ .cache의 속성 평가 결과 않기 때문에 - 데이터 속성을 평가하고 나면 결국, 그것은 낭비입니다 모든 .DATA () 호출에 재 - 평가 - 특히 데이터 변수 이후 복잡한 JSON 문자열을 포함 할 수 있습니다.

    .DATA를 통해 속성을 검색 한 후 () .attr에 의해 변경 ( '데이터 myVar에가', '') 이후 .DATA () 호출에 의해 볼 수 없습니다 : 나는 다음과 같은 말을하는 모든 말했다. jsfiddle에이 밖으로을 테스트합니다.

    이 문제를 방지하려면하지 인터 .DATA 및 .attr () 호출을한다. 둘 중 하나를 사용합니다.


  2. 2.이것은 오해의 결과입니다 데이터가 데이터 - * 속성에 대한 접근이 아닙니다. 그것은 모두 더 적은 것보다입니다.

    이것은 오해의 결과입니다 데이터가 데이터 - * 속성에 대한 접근이 아닙니다. 그것은 모두 더 적은 것보다입니다.

    데이터 요소에 jQuery의 데이터 캐시에 대한 접근이다. 거기에 어떤 존재하지만 데이터가 결코 속성에 기록하지 않으며, 속성 변경을 초기화 한 후 데이터 캐시를 변경 않을 경우 그 캐시는 데이터 - * 속성에서 초기화된다 :

    CONST DIV = $ ( "[데이터 예]"); CONSOLE.LOG ( 'div.data ( "예")'div.data ( "예")); CONSOLE.LOG ( 'div.attr ( "데이터 예")'div.attr ( "데이터 예")); ( '을 div.data ( "예") "갱신"을 사용하여') CONSOLE.LOG; div.data ( "예", "업데이트"); CONSOLE.LOG ( 'div.data ( "예")'div.data ( "예")); CONSOLE.LOG ( 'div.attr ( "데이터 예")'div.attr ( "데이터 예"));

    <스크립트 SRC = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js">

    데이터 또한 데이터 응답 = "42"숫자가 아닌 문자열, 또는 모양을하는 경우도 JSON으로 일을 구문 분석과 요소는 데이터 유형에서 추측, 다양한 방법으로 무엇을 발견 마사지, 데이터 만들기 ( "대답을") JSON :

    CONSOLE.LOG ($ 대해서 typeof ( "[데이터 않음]")의 데이터 ( "답변").); CONSOLE.LOG ($ 대해서 typeof ( "[데이터 JSON]")의 데이터 ( "JSON").); CONSOLE.LOG ($ 대해서 typeof ( "[데이터 STR]")의 데이터 ( "STR").);

    <스크립트 SRC = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js">

    당신은 속성 (읽기 및 설정 모두)를 사용 ATTR가 아닌 데이터를 사용합니다. ATTR은 속성에 대한 접근이다.


  3. 3..attr ( "데이터 - itemName에"는 "someValue와")는 DOM을 수정한다.

    .attr ( "데이터 - itemName에"는 "someValue와")는 DOM을 수정한다.

    .DATA ( "itemName에"는 "someValue와")는 jQuery를 캐시를 수정합니다.

    자바 스크립트를 다음과 CSS에 추가하여이 작업을 얻으려면 모두를 설정해야합니다.

    theaterA.find(".someLink").attr("data-itemname", "someValue");
    theaterA.find(".someLink").data("itemname", "someValue");
    

  4. 4.속성의 이름은 데이터 itemName에이기 때문이다. 당신은 사용할 수 없습니다 - 속기의 obj.attribute 표기법 (obj.data-itemName에는 "itemName에 obj.data 마이너스"로 해석하여 될 것이다).

    속성의 이름은 데이터 itemName에이기 때문이다. 당신은 사용할 수 없습니다 - 속기의 obj.attribute 표기법 (obj.data-itemName에는 "itemName에 obj.data 마이너스"로 해석하여 될 것이다).


  5. 5.왜 그냥 .DATA () 모든 곳에서 사용하지 마십시오?

    왜 그냥 .DATA () 모든 곳에서 사용하지 마십시오?

    또한 인라인 너무 잘되는 HTML에 기본 값을 선언 할 수 있습니다.

    <span data-code="pony">text</span>
    

    $("span").data("code") == "pony" // true
    

    당신이 그것을 변경하려는 경우 당신은 다만

    $("span").data("code", "not-a-pony");
    

    당신이 호출 할 수 완전히 제거하기

    $("span").removeData("code");
    

    당신은 정말 시도해야하고 그렇게 어쨌든 할 싶어 이유를 피하기 ( "데이터 - *")를 .attr 사용하여, 나는 모른다.


  6. 6.당신은 .DATA ( 'itemName에', 'someValue와')를 사용하여 데이터를 설정해야합니다 ;. 설정 데이터 속성에 .attr ()를 사용하지 않습니다 일 : http://jsfiddle.net/ThiefMaster/YHsKx/

    당신은 .DATA ( 'itemName에', 'someValue와')를 사용하여 데이터를 설정해야합니다 ;. 설정 데이터 속성에 .attr ()를 사용하지 않습니다 일 : http://jsfiddle.net/ThiefMaster/YHsKx/

    그러나 예를 들어, 사용하여 인라인 값을 제공 할 수 있습니다 마크 업

    .


  7. 7.나는이 데이터 속성 설정에 접근하는 방법에 대한 몇 가지 부문을 가져왔다 것을 볼 수 있습니다.

    나는이 데이터 속성 설정에 접근하는 방법에 대한 몇 가지 부문을 가져왔다 것을 볼 수 있습니다.

    나도이 문제로 실행하고 나는 문제가 서식 단순히 데이터 속성 이름 것 ​​같았다 것을 발견했다.

    내 경험에 의하면, 당신은 데이터 변수 ( "데이터 -"뒤에 오는 변수 이름) 하이픈을 사용하지 않아야합니다.

    이것은 나를 위해 작동하지 않았다 :

    [마크 업]

    <div class="list" id="myElement1" data-item-order="some-value"> .... </div>
    

    [jQuery를]

    jQuery("#myElement1").data("item-order", "my-new-value");
    

    그러나 다음은 잘 일했다! :) :

    (필수 때 하이픈 대신 밑줄을 사용)

    [마크 업]

    <div class="list" id="myElement1" data-item_order="some-value"> .... </div>
    

    [jQuery를]

    jQuery("#myElement1").data("item_order", "my-new-value");
    

    나는 그것이 도움이되기를 바랍니다. 건배 모두!

  8. from https://stackoverflow.com/questions/8707226/jquery-data-does-not-work-but-attr-does by cc-by-sa and MIT license