js中，使用<li>的自定义属性传值

今天拿到前端提供的页面，前端使用 <li> 标签实现滚动选择框的效果。

关于选择部分，后台主要传输 数据类型包涵 id 与 name 。id 为处理业务逻辑的依据，name 主要是用来显示。

由于 id 字段的数据包含非数字的字符，不能用 value 属性绑定（value属性只能绑定数字）。固使用 自定义属性绑定 id。

使用setAttribute方法绑定id值

function getInfoList(){
        var _url = "getInfoList",
         _postData = {
        };
        common.ajax(_url, _postData, function (data) {
            if (data.status=='SUCCESS') {
            var list=data.result;
            var menu=document.getElementById("menu");
            for(var i=0;i<list.length;i++){
                var item=list[i];
                var li=document.createElement("li");
                var node=document.createTextNode(item.name);
                li.setAttribute("id", item.id);
                li.appendChild(node);
                menu.appendChild(li);
            }
            } else {
                common.tips("查询信息异常");
            }
        });
    }

使用getAttribute拿到属性的值

function choosePost(){
        var choose = document.getElementsByClassName("swiper-slide swiper-slide-active")[0];
        var _url = "getInfo",
            _postData = {
                id:choose.getAttribute("id")
            };
            common.ajax(_url, _postData, function (data) {
                if (data.status=='SUCCESS') {
                } else {
                    common.tips("查询信息异常");
                }
            });
    }