html5 사용자 정의 데이터가 IE 6의 "작업"속성에 속하는가?

StackOverflow https://stackoverflow.com/questions/2412947

문제

사용자 정의 데이터 속성 : http://dev.w3.org/html5/spec/overview.html#embedding-custom-visible-data

내가“일”이라고 말할 때, 나는 다음과 같은 html을 가지고 있다면 :

<div id="geoff" data-geoff="geoff de geoff">

다음 JavaScript :

var geoff = document.getElementById('geoff');
alert(geoff.dataGeoff);

IE 6에서 "Geoff de Geoff"에 대한 경고를 생산합니까?

도움이 되었습니까?

해결책

사용하여 사용자 정의 (또는 자신의) 속성 값을 검색 할 수 있습니다. getAttribute. 당신의 예를 따릅니다

<div id="geoff" data-geoff="geoff de geoff">

나는 가치를 얻을 수 있습니다 data-geoff 사용

var geoff = document.getElementById("geoff");
alert(geoff.getAttribute("data-geoff"));

보다 MSDN. 그리고 이것을 작동시키기 위해 IE7이 필요하다고 언급되었지만, 나는 얼마 전에 IE6으로 이것을 테스트했으며 (Quirks 모드에서도) 올바르게 작동했습니다.

그러나 이것은 물론 HTML5- 특이 적 속성과 관련이 없습니다.

다른 팁

예, 그들은 일합니다.

IE는 지원했습니다 getAttribute() jQuery가 내부적으로 사용하는 IE4에서 data().

data = elem.getAttribute( "data-" + key ); // Line 1606, jQuery.1.5.2.js

jQuery를 사용할 수 있습니다 .data() 방법 또는 일반 바닐라 JavaScript :

샘플 html

<div id="some-data" data-name="Tom"></div>

자바 스크립트

var el = document.getElementById("some-data");
var name = el.getAttribute("data-name");
alert(name);

jQuery

var name = $("#some-data").data("name");

IE6은 HTML5 데이터 속성 기능을 지원하지 않을뿐만 아니라 사실상 사실상. 아니요 현재 브라우저가 지원합니다! 현재 유일한 예외는 Chrome입니다.

당신은 완벽하게 사용하기에 완벽합니다 data-geoff="geoff de geoff" 속성으로, 현재 브라우저 버전의 크롬 만 .dataGeoff 재산.

다행스럽게도, 모두 IE6을 포함한 현재 브라우저 - 표준 DOM을 사용하여 알려지지 않은 속성을 참조 할 수 있습니다. .getAttribute() 방법 .getAttribute("data-geoff") 어디서나 일할 것입니다.

가까운 시일 내에 새로운 버전의 Firefox 및 Safari가 데이터 속성을 지원하기 시작하지만 모든 브라우저에서 작동하는 완벽하게 액세스하는 방법이 있기 때문에 HTML5 메소드를 사용할 이유가 없습니다. 일부 방문자만을 위해 일합니다.

이 기능에 대한 현재 지원 상태에 대한 자세한 내용은 caniuse.com.

도움이되기를 바랍니다.

IE는 항상 이것 (적어도 IE4부터 시작)을 지원했으며 JS에서 액세스 할 수 있다고 생각합니다. 그것들을 '확장 속성'이라고 불렀습니다. 보다 오래된 MSDN 기사

이 동작은 Expando를 설정하여 비활성화 할 수 있습니다 재산 DOM 요소에서 false에 (기본적으로 사실이므로 확장 속성 기본적으로 작업).

편집 : URL을 수정했습니다

최신 브라우저의 데이터 세트 속성과 같이 모든 사용자 정의 데이터 속성을 한 번에 검색하려면 다음을 수행 할 수 있습니다. 이것이 제가 한 일이며 IE7+에서 저를 위해 잘 작동합니다.

function getDataSet(node) {
    var dataset = {};
    var attrs = node.attributes;
    for (var i = 0; i < attrs.length; i++) {
        var attr = attrs.item(i);
        // make sure it is a data attribute
        if(attr.nodeName.match(new RegExp(/^data-/))) {
            // remove the 'data-' from the string 
            dataset[attr.nodeName.replace(new RegExp('^data-'), '')] = attr.nodeValue;
        }
    }
    return dataset;
}

~ 안에 IE6, 작동하지 않을 수 있습니다. 참조 : MSDN

jQuery를 사용하여 대부분의 경우를 처리하는 것이 좋습니다.

var geoff = $("#geoff").data("data-geoff");
alert(geoff);

코딩에서 이것을 시도하십시오.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top