使javascript-snippet影響3 div而不是1

Question

我有這個非常有用的一小段JavaScript中心mig div。我想使它適用於同一網站上的3個div，而不必重複3次相同的代碼。

關於如何做到這一點的任何想法？ 把所有3個div放入1個div來照顧它，不是和可選項。

<script type="text/javascript"> 
    <!-- 
    function getWindowHeight() { 
     var windowHeight = 0; 
     if (typeof(window.innerHeight) == 'number') { 
      windowHeight = window.innerHeight; 
     } 
     else { 
      if (document.documentElement && document.documentElement.clientHeight) { 
       windowHeight = document.documentElement.clientHeight; 
      } 
      else { 
       if (document.body && document.body.clientHeight) { 
        windowHeight = document.body.clientHeight; 
       } 
      } 
     } 
     return windowHeight; 
    } 
    function setContent() { 
     if (document.getElementById) { 
      var windowHeight = getWindowHeight(); 
      if (windowHeight > 0) { 


      var contentElement = document.getElementById('outer'); 
       var contentHeight = contentElement.offsetHeight; 

       if (windowHeight < 570) { 
        contentElement.style.position = 'relative'; 
        contentElement.style.top = '30px'; 
       } 
       else if (windowHeight - contentHeight > 0) { 
        contentElement.style.position = 'relative'; 
        contentElement.style.top = ((windowHeight/2) - (contentHeight/2)) + 'px'; 
       } 





       else { 
        contentElement.style.position = 'static'; 
       } 

      } 
     } 
    } 
    window.onload = function() { 
     setContent(); 
    } 
    window.onresize = function() { 
     setContent(); 
    } 
    //--> 
    </script> 

問候特勒爾斯

Answer 1

你並不需要檢查是否存在document.getElementById。自羅馬帝國以來它一直受到支持。

將id或必須居中的實際元素傳遞給您的函數。這消除了您的情況下對固定元素（#outer）的依賴關係，並使其更加靈活。另外嘗試命名你的函數來表示他們實際在做什麼。 setContent是一個非常通用的名稱，並不表示任何地方的居中方面。

function centerElementWithId(id) { 
    .. 
    var contentElement = document.getElementById(id); 
    .. 
} 

然後三次調用它，

centerElementWithId('outer') 
centerElementWithId('secondDiv') 
centerElementWithId('thirdDiv');