关于js开发的小问题

一、开发当中经常会动态拼接html，当然为了简便性好多人直接就是使用内联事件：

$('#td1').html( '<a href="#" onclick="app.showPostEdit('+aData+')"></a>');

 $.Test = {
            GetData: function () {
                $.post("/Home/GetData", function (backdata) {
                    var strHtml = "";
                    $.each(backdata, function (itemIndex, item) {
                        strHtml += "<div class=\"row\">";
                        strHtml += "    <div class=\"col-md-4\">";
                        strHtml += "        " + item.Id;
                        strHtml += "    </div>";
                        strHtml += "    <div class=\"col-md-4\">";
                        strHtml += "        " + item.Url;
                        strHtml += "    </div>";
                        strHtml += "    <div class=\"col-md-4\">";
                        strHtml += "        <button class=\"btn btn-sm\" onclick=\"$.Test.AppendBtn(" + item + ")\">" + item.Name + "</button>";
                        strHtml += "    </div>";
                        strHtml += "</div>";
                    });
                    $("#content").append(strHtml);
                });
            },
            AppendBtn: function (str) {
                console.log(str);
                alert(str.Name);
            }
        };

浏览器会把它解析为：

<button class="btn btn-sm" onclick="$.Test.AppendBtn(eval([object Object]))">Name1</button>

毫无疑问，上面这种情况肯定是不对的；通常这种解决方案有两种：

1、使用全局变量，函数中传递对象索引，在具体的函数根据索引取出相应的对象

2、不使用内联事件，动态注册事件

 

当然还有一种方法，就是把对象的属性分别取出来进行传递；如果只有一两个还可以，否则.........你懂的！如果有更好的解决方案，请指教，多谢哦！

 

二、当业务比较复杂，一个页面中可能要写多个js文件，某个js文件可能使用common.js中的方法，而真正去写代码时会发现没有提示；

　　只需要把common.js拖到你当前的js文件中即可；

     你的js文件会出现：/// <reference path="common.js" />