渲染的问题 关于优化

Question

需求：根据页面的每个UL的里面的input的value值然后渲染出对应li的选中的状态，【不依赖第三方库，原生实现】现在功能已经实现了，但是在性能这边是相当不好的 ， 请大神给他个思路或者一段代码 让我理解一下 谢谢

Answer 1

<div id="list">

    <ul>

        <input type="hidden" value="2" />

        <li></li>

        <li></li>

        <li></li>

    </ul>

    <ul>

        <input type="hidden" value="1" />

        <li></li>

        <li></li>

        <li></li>

    </ul>

    <ul>

        <input type="hidden" value="3" />

        <li></li>

        <li></li>

        <li></li>

    </ul>

</div>

init();

function init() {

    var dul = document.getElementById('list'), uls = dul.children, i = 0, len = uls.length;

    for (; i < len;) {

        var lis = uls[i++].children, index = lis[0].value;

        lis[index].className = index;

        //lis[index].innerHTML = index;

    }

}