如何将JavaScript值分配给CSS属性？

Question

我有一个div元素：

<div class="page">
        //some contents
</div>

CSS：

.page{
    bottom: 0;
    color: #1f1f21;
    font-size: 17px;
    font-weight: 400;
    left: 0;
    overflow: visible;
    position: absolute;
    right: 0;
    top: 0;
}

使用JavaScript获取屏幕高度：

var page_height = screen.height;
alert(page_height);

如何将此page_height值应用于我的.page课程？

（即）我需要将屏幕高度设置为page类

例如，如果screen.height = 405

我需要添加高度属性

height: 405px;

Answer 1

使用.height()：

$('.page').height(page_height);

Answer 2

试试这个Fiddle

var page_height = screen.height;
$('.page').height(page_height)
alert(page_height);

.page{
    bottom: 0;
    color: #1f1f21;
    font-size: 17px;
    font-weight: 400;
    left: 0;
    overflow: visible;
    position: absolute;
    right: 0;
    top: 0;
    width:500px;
    background:green;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<div class="page">
        //some contents
</div>