javascript - JavaScript を使用して、css3 および/または HTML5 プロパティがブラウザでサポートされているかどうかを確認するには

Question

「contenteditable」または HTML5 プロパティがユーザーのブラウザでサポートされているかどうかを確認したいですか?

だからここに私のJavaScriptがあります：

var isEditable=false;
function chk() {
    var z=document.getElementById("mydivid");

    if(typeof(z["isContentEditable"])==="boolean") {
        isEditable=true;
    }
}

function doEdit() {
    chk();
    var z=document.getElementById("mydivid");
    if(isEditable) {
        z.setAttribute("contenteditable","true");
        z.focus();
    } else {
        /* add a texbox and put all div's innerHTML into it, All in all:  a Boring Stuff. */
    }
}

HTML は次のとおりです。

<a href="#" onclick="doEdit();">Click To Edit </a>
<div id="mydivid"> Hi Ssup ?? <img src='' alt="some image" /></div>

私のアプローチが正しいかどうか教えてもらえますか? IE(バージョン<8.0)で動作しますか? また、より良いアプローチが必要です!

Answer 1

簡単なチェック:

if ('isContentEditable' in document.createElement('span')) {
    // supported
}

また、将来役立つこの素晴らしいスニペットのセレクションも共有します: http://diveintohtml5.info/everything.html

Answer 2

要素のプロパティが存在するかどうかを確認します。あなたはこれを行うことができます

var element = document.createElement('__ELEMENT__');
if ('__PROPERTY__' in element ) {
    // property supported in the browser
}

また

if ('__PROPERTY__' in document.createElement('__ELEMENT__') ) {
    // property supported in the browser
}

以下のリンクにすべてが含まれています。

1. https://github.com/Modernizr/Modernizr/issues/570
2. http://diveintohtml5.info/everything.html#contenteditable