1

可能有更好的方法来做到这一点，但目前我有一个封装良好的 JavaScript 对象，它可以有一些可配置的选项。我在页面上包含了一大段 HTML 代码（通过 Dreamweaver 'snippets'），在页面加载时，我的 JS 文件通过 DOM 运行，并将这些代码块中的任何一个标识为特定功能，然后继续设置该功能。

在我希望在页面上添加多个对象并让它们可配置之前，这一切都很好。这里重要的一点是，您可以使用我当前的设置将任意数量的这些对象添加到页面上——因为它们在那时是通用的，并且没有“id”属性。

现在我希望配置这些对象，所以我想，“如何包含配置设置的外部文件，如果找到配置对象，这些对象会检查并应用这些设置”。这也很好用，但配置数据现在感觉有点“删除”了。我想这最终会让我的其他同事感到恼火，这只是另一件事要记住。

所以对于我的问题，我很高兴插入这些代码块，它们仍然会在页面加载时触发自实例化对象 - 但我想尝试的是插入一个包含配置设置的脚本块。我需要一种插入代码块的方法，知道它的父元素是配置的上下文。

示例代码：

<div class="snippet">
    <_contents of this 'snippet'_/>
    <script type="text/javascript">
        new Snippet().init({
            rootElement: REFERENCE_TO_THIS_SCRIPT_TAGS_PARENT_NODE,
            configOptionA: true,
            configOptionB: false
        });
    </script>
</div>

注意：<div class="snippet">故意没有 'id' 属性，因为我想允许将多个其中之一拖放到页面上。

欢迎其他解决方案，只要它们遵守我的一些限制！

4

1 回答 1

0

我的另一个相关问题（现已回答）现在解决了这个问题，基本上我最终得到了：

<div class="snippet">
    <elements... />
    <script type="text/javascript">
        var tmpVarName = 'configOb_'+Math.floor(Math.random()*1111111) ;
        document[tmpVarName] = {
            remainVisible:true,
            hoverBehaviour:false
        };        
    </script>
</div>

...然后在每个页面上加载的脚本中扫描任何适当的元素以实例化和配置：

var snippets = yd.getElementsBy(function(el){
                    return yd.hasClass(el, "snippet");
                },null,document );
for( var i=0; i<snippets.length;i++ )
{
    var s = snippets[i] ;
        yd.generateId(s, '_snippet_'+i );
    var tag = yd.getElementBy(function(el){
                return true;
            },'script',s );
    var ob = new Snippet();
        ob.setId( s.id );
        ob.init( eval( tag.innerHTML ) );
}

有关上述代码的更完整上下文；

  • yd = YAHOO.util.Dom
  • Snippet.init() 和 Snippet.setId() 是在名为 Snippet() 的 Module 对象上公开的方法

现在我插入的内容“块”没有 id 属性，并且没有动态评估的上下文配置对象 - 我可以随意添加任意数量的变体。如果将一大堆这些 Snippet() 对象添加到我的页面（不太可能），我唯一真正关心的是性能。

于 2010-06-21T01:02:25.150 回答