javascript - 找到类(class)的高度并申请另一个类(class)

Question

几个小时以来，我一直在网上寻找答案，但找不到任何答案，所以我希望有人能帮助我。

我想获取类为 movie 的包装 div 的高度，并将其应用于类为 movie-center 的内部 div。我如何使用 JS 或 jQuery 执行此操作？

我是 JS 的新手，所以如果您能为我安排一切(包括任何需要的 HTML)，我将不胜感激。

谢谢!

编辑 1: 如果我解释我在做什么，人们可能会有更好的理解。我正在制作一个响应式 WordPress 主题。浏览器的宽度越小，电影的宽度就越小。我希望覆盖标题和图形位于中心。我尝试使用 CSS 执行此操作，但无法完全完成，除非我知道确切的高度(我不知道，因为要调整大小)。

编辑 2: 这是浏览器呈现的 html 代码:

<article id="movie-97" class="post-97 movie type-movie status-publish hentry"><a href="http://localhost:8888/movies/hard-truth-levity-hope">

<div class="movie-center">

    <div class="movie-overlay">

        <div class="movie-play"></div>

        <h2 class="movie-title">Hard Truth, Levity and Hope</h2>

    </div> <!-- end .movie-overlay -->

</div> <!-- end .movie-center -->

<div class="movie-thumb"><img width="480" height="270" src="http://localhost:8888/wp-content/uploads/2014/03/truth-levity-hope.jpg" class="attachment-movie-thumb wp-post-image" alt="Hard Truth, Levity and Hope" /></div>

编辑 3: Here's a Pastebin for my website .注意:它已被精简为仅显示网站的基本部分。

Answer 1

您的做法是正确的。确保您已正确加载 jQuery 并尝试将代码包装在 DOM 就绪处理程序 $(document).ready(function() {...}); 或更短的形式 $(函数() {...});

$(function() {
    $('.movie').each(function() {
        var h = $(this).height();
        $(this).find('.movie-center').height(h);
    });   
});

---

编辑:由于您使用的是 Wordpress，这里可能会发生冲突，请尝试使用:

jQuery(document).ready(function($) {
    $('window').resize(function() {
        $('.movie').each(function() {
            var h = $(this).height();
            $(this).find('.movie-center').height(h);
        });  
    }).resize();
});