怎么script里面动态给标签li添加function()或者获取焦点事件

Question

<img src="images/dd_scroll_2.jpg" alt="轮换显示的图片广告" id="dd_scroll" style="list-style:none"/>          
<ul id="number_z"> 
                    <li  style="margin-top:5px; border:#000 1px solid ;">1</li>
                        <li  style="margin-top:5px; border:#000 1px solid ;">2</li>
                        <li  style="margin-top:5px; border:#000 1px solid ;">3</li>
                        <li  style="margin-top:5px; border:#000 1px solid ;">4</li>
                        <li  style="margin-top:5px; border:#000 1px solid ;">5</li>
                        <li  style="margin-top:5px; border:#000 1px solid ;">6</li>
             </ul>
            </div>
            <script type="text/javascript">
    var oUl = document.getElementById('number_z');
    var images=document.getElementById("dd_scroll");
for(var i=0;oUl.getElementsByTagName("li").length>i;i++){
var u=i+1;
oUl.getElementsByTagName("li")[i].onmouseover=function(){<--动态添加li-->            images.src="images/dd_scroll_"+u+".jpg";
}
}
</script>
我想直接在script里面给LI  直接添加鼠标获取焦点事件

Answer 1

var obj = document.getElementById('number_z').getElementsByTagName('li');
var images = document.getElementById("dd_scroll");
for (var i = 0; i < obj.length; i++) {
    with({u: i + 1}) {
        obj[i].onmouseover = function() {
            images.src = "images/dd_scroll_" + u + ".jpg";
        }
    }
}

Answer 2

或者给所有的li元素增加一个自定义属性来实现：
<img src="images/dd_scroll_2.jpg" alt="轮换显示的图片广告" id="dd_scroll" style="list-style:none"/>
<ul id="number_z">
  <li style="margin-top:5px; border:#000 1px solid;" imgsrc="1">1</li>
  <li style="margin-top:5px; border:#000 1px solid;" imgsrc="2">2</li>
  <li style="margin-top:5px; border:#000 1px solid;" imgsrc="3">3</li>
  <li style="margin-top:5px; border:#000 1px solid;" imgsrc="4">4</li>
  <li style="margin-top:5px; border:#000 1px solid;" imgsrc="5">5</li>
  <li style="margin-top:5px; border:#000 1px solid;" imgsrc="6">6</li>
</ul>
</div>
<script type="text/javascript">
var obj = document.getElementById('number_z').getElementsByTagName('li');
var images = document.getElementById("dd_scroll");
for (var i = 0; i < obj.length; i++) {
obj[i].onmouseover = function() { images.src = "images/dd_scroll_" + this.getAttribute("imgsrc") + ".jpg"; }
}
</script>