首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

怎么比较多个标签获取并获得最低高度的对象

2012-11-14 
怎样比较多个标签获取并获得最低高度的对象如题我有HTML codeulli1/lili2/lili3/lili4/l

怎样比较多个标签获取并获得最低高度的对象
如题 

我有

HTML code
<ul><li>1</li><li>2</li><li>3</li><li>4</li></ul>


这4个 li 高度不一致 我想获取 高度最小的 li标签 怎样获取呢 谢谢

[解决办法]
HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head>    <title></title>    <style>           </style></head><body><ul><li style='height:10px;'>1</li><li style='height:30px;'>2</li><li style='height:20px;'>3</li><li style='height:40px;'>4</li></ul><script>    var a = document.getElementsByTagName('li');    var b = new Array();    for (var i = 0; i < a.length; i++) {        b.push(parseInt(a[i].style.height));        if (parseInt(a[i].style.height) == arrMin(b)) {            a[i].style.background='red';                     }    }    function arrMin(array) {        return Math.min.apply(Math,array);    }           </script></body></html>
[解决办法]
HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title></head><body><ul>  <li style="height:100px;">1</li>  <li style="height:50px;">2</li>  <li style="height:40px;">3</li>  <li style="height:80px;">4</li></ul><script type="text/javascript">var obj = document.getElementsByTagName('li');var maxHeight = 100000;var idx = '';for(var i = 0; i < obj.length; i ++) {    if (obj[i].offsetHeight < maxHeight) {        maxHeight = obj[i].offsetHeight;        idx = i;    }}alert('高度最低的是索引号为' + idx + '的li元素');</script></body></html> 

热点排行