javascript - テキストを拡大するJavaScript onclick関数

Question

理由はわかりませんが、これを機能させることができないようです。

これが私のフォントを拡大する機能です。

<script type="text/javascript">
    function growText() {
        var text = document.getElementById("t_left_text");
        text.font-size=22px;        
</script>

そして、ここで私はそれを呼んでいます

<div id="t_left" onclick="growText()">
    <br />
    <p id="t_left_text">Mountains are beautiful land structures <br /> that are a result of plate tectonics.</p>
    <br />
</div>

Answer 1

以下のコードを使用

function growText() {
            var text = document.getElementById("t_left_text");
            text.style.fontSize ="22px";
}

作業例http://jsfiddle.net/D2anZ/

Answer 2

これは、CSS を使用して目的を達成するバージョンです。そうすれば、同時に異なるテキストのセットに対してこれを行い、そのフォント サイズを変更したい場合、変更を行う必要がある場所は 1 か所だけです。(または、他の css プロパティ (色など) も追加したい場合)

フィドル

JavaScript

function growText() {
    var text = document.getElementById("t_left_text");
    text.className = 'large-font';
}

CSS

.large-font {
    font-size: 22px;
}