javascript - 如何检查浏览器对 HTML5 表单属性的支持？

Question

如何检查浏览器是否支持formtargetorform属性？

Modernizr 在这里没有任何帮助，我什至无法在网络上找到有关form浏览器当前支持状态的信息。尽管快速测试显示除 IE 9 之外的所有当前浏览器都支持它们。

那么如何检查浏览器是否处理这些form*属性呢？

Answer 1

干得好：

if("formtarget" in document.createElement("input")){
    //good job, browser
}else{
    //nope
}

Answer 2

input上的form属性是一种特殊情况。它在 HTML5 功能之前用于引用父表单，但现在它也用作属性，因此在 IE 上会出现误报。

有一个检查功能，但它涉及与 DOM 的交互，这可能会影响性能，但无论如何都可以。希望能帮助到你。

function testInputFormSupport() {
    var input = document.createElement('input'),
         form = document.createElement('form'),
         formId = 'test-input-form-reference-support';
    // Id of the remote form
    form.id = formId;
    // Add form and input to DOM
    document.body.appendChild(form);
    document.body.appendChild(input);
    // Add reference of form to input
    input.setAttribute('form', formId);
    // Check if reference exists
    var res = !(input.form == null);
    // Remove elements
    document.body.removeChild(form);
    document.body.removeChild(input);
    return res;
}

Answer 3

看看这个网站。它涵盖了所有新的表单功能，并提供了一个方便的小功能来测试属性的支持

// Function to test for attribute support
function elSupportsAttr(el, attr) {
  return attr in document.createElement(el);
}

Answer 4

尝试

if ("attribute" in document.createElement("tag"))

来自如何使用 Javascript 判断 HTML 属性是否存在