如何在使用jQuery UI小部件时发现所有可用的属性?

Question

我最近发现有一些jQuery UI小部件的附加属性可以工作，但没有记录。例如，当在jQuery UI 1.11.4对话框中提供buttons属性时，我可以使用id和autofocus这样的子属性，这两个属性都没有在官方文档中列出。

$("#myDialog").dialog({
    title: "Do the thing?"
    buttons:
    [
        {
            text: "Yes",
            id: "dialogBtnYes",
            click: function () {
                $(this).dialog("close")
            }
        },
        {
            text: "No thanks",
            id: "dialogBtnNo",
            autofocus: true,
            click: function () {
                $(this).dialog("close")
            }
        }
    ]
});

我想知道有多少其他未记录的选项可供我使用。我试过梳理JavaScript文件，但对于像我这样的JavaScript新手来说，这是非常令人生畏的。

你们会推荐通过梳理源代码来找出其他"隐藏"的特性吗，还是说这是不可行的?如果是这样的话，你能给我一些建议，让我在太阳变成红巨星之前完成这个任务吗?如果没有，您会推荐哪些其他方法来学习jQuery UI(或任何JavaScript框架)所提供的其他内容?

Answer 1

使用递归函数枚举库的所有方法和属性。例如:

function getUDFs()
    {
    var current;
     /* Use a local variable named current instead of a global variable */
    for(current in arguments[0])
      {
      getUDFs.id = arguments[1]  + " => ";
      /* If the property is not null or undefined */
      if (!!arguments[0][current] || arguments[0][current] === "")
        {
        /* If the constructor is a standard JavaScript type */
        if (/Function|String|Object/.test(String(arguments[0][current].constructor) ) )
          {
          /* Store in an array */
          if (getUDFs.hasOwnProperty("data") )
            {
            getUDFs.data.push(getUDFs.id + current)
            }
          else
            {
            getUDFs.data = []
            }
          }
        if (/Object|Function/.test(String(arguments[0][current].constructor) ) )
         {
         getUDFs(arguments[0][current], getUDFs.id + current)
         }
        }
      }  
     }
getUDFs($.ui,"jQueryUI");
console.log(getUDFs.data);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>

一旦jQuery UI对象成为DOM元素，就会添加id和mousemove属性。例如:

function getUDFs()
    {
    var current;
    for(current in arguments[0])
      {
      getUDFs.id = arguments[1]  + " => ";
      if (!!arguments[0][current] || arguments[0][current] === "")
        {
        if (/Function|String|Object/.test(String(arguments[0][current].constructor) ) )
          {
          if (getUDFs.hasOwnProperty("data") )
            {
            getUDFs.data.push(getUDFs.id + current)
            }
          else
            {
            getUDFs.data = []
            }
          }
        if (/Object|Function/.test(String(arguments[0][current].constructor) ) )
         {
         getUDFs(arguments[0][current], getUDFs.id + current)
         }
        }
      }  
     }
getUDFs(document.body,"document.body");
console.log(getUDFs.data);

引用

• Object.prototype。proto - JavaScript | MDN
• 原型和原型继承
• JavaScript中的类-解释
• 从QSA到Qt Script | Qt 4.8
• objectTree
• Tour de Flex