Verwenden von Variablen in Funktionsparametern, mit oder ohne Jquery

Question

Ich möchte eine Funktion schreiben, die ich mit verschiedenen Elementen wiederverwenden könnte.

Die Idee ist, die Fensterhöhe zu erhalten und sie auf verschiedene Elemente anzuwenden.

Ich dachte, ich so etwas tun könnte, aber es funktioniert nicht:

function autoHeight(element) { 
    var height = window.innerHeight; 
    $(element).css('height', height); 
} 

autoHeight('.dashboard-sidebar'); 
autoHeight('.some-element'); 

Es funktioniert nicht. Ich weiß, ich bin nah dran, aber mir fehlt etwas!

Vielen Dank im Voraus!

Answer 1

Mit JavaScript

function autoHeight(element) { 
 
    var height = window.innerHeight; 
 
    var ele = document.querySelector(element); 
 
    if (ele) { 
 
    ele.style.height = height + 'px'; 
 
    } 
 
} 
 

 
autoHeight('.dashboard-sidebar'); 
 
autoHeight('.some-element');

div { 
 
    width: 120px; 
 
    height: 120px; 
 
    background: #DDDDDD; 
 
    margin: 5px; 
 
    display: inline-block; 
 
}

<div class="dashboard-sidebar"></div> 
 
<div class="some-element"></div>

Answer 2

scheint hier zu funktionieren: https://jsfiddle.net/gerLe2x9/

Haben Sie Ihre JS in $(window).load gewickelt:

$(window).load(function() { 
    function autoHeight(element) { 
     var height = window.innerHeight; 
     $(element).css('height', height); 
    } 

    autoHeight('.dashboard-sidebar'); 
    autoHeight('.some-element'); 
}