Question

我正在我的网站C#和ASP.NET MVC 3上实施OpenID和OAuth。我基于DotNetOpenAuth作为后端，openid-selector作为前端。

我喜欢openid-selector，但它没有开箱即用的OAuth支持，所以我开始调整它（在StackOverflow's implementation和jsbeautifier的帮助下。< / p>

我找到了很多像这样处理DOM的代码：

function highlight(boxId) {
    // remove previous highlight.
    var highlight = $('#openid_highlight');
    if (highlight) {
        highlight.replaceWith($('#openid_highlight a')[0]);
    }
    // add new highlight.
    $('.' + boxId).wrap('<div id="openid_highlight"></div>');
};

或

function useInputBox(provider) {
    var area = $('#openid_input_area');
    var id = 'openid_username';
    var html = '';
    var value = '';
    var style = '';
    var label = provider.label;
    if (label) {
        html = '<p>' + label + '</p>';
    }
    if (provider.name == 'OpenID') {
        id = this.input_id;
        value = 'http://';
        style = 'background: #FFF url(' + spritePath + ') no-repeat scroll 0 50%; padding-left:18px;';
    }
    html += '<input id="' + id + '" type="text" style="' + style + '" name="' + id + '" value="' + value + '" />'
         +  '<input id="openid_submit" type="submit" value="' + this.signin_text + '"/>';
    area.empty();
    area.append(html);
    $('#' + id).focus();
};

这对我来说听起来像他们对DOM的假设太多（太多的ID或DOM的当前状态）。

将javascript紧密耦合到DOM是否可以？什么是避免这样的代码并采用不那么干扰的方法的最佳方法？

我想让我感到困惑的是：

openid.init('openid_identifier', '', 'http://cdn.sstatic.net/Img/openid/openid-logos.png?v=8', true);

当脚本文件中已经有很多假设时。

Answer 1

我认为，因为你怀疑这是一件坏事。

Javascript UI开发中存在巨大缺乏的设计模式。我猜很多人直接从html，学习一些jQuery，到编写Web应用程序。

一个能够更好地处理这个问题的简单系统（我发现）是backbone.js。源代码清晰易读，它可以很好地区分视图问题和业务逻辑问题。

Answer 2

对于更多MVVM方法（也称为数据绑定），knockoutjs是一种选择。他们也有一个很好的interactive tutorial来帮助你入门。

javascript代码有多少DOM知识？

2 个答案: