的JavaScript的onclick功能放大文本

我不知道爲什麼，但我似乎無法得到這個工作。的JavaScript的onclick功能放大文本

這裏是我的功能，以擴大自己的字體。

<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>

來源

2013-05-08 user2297666

嘗試text.style.fontSize。 – 2013-05-08 14:19:01

嘗試：

text.style.fontSize = "22px";

DEMO：http://jsfiddle.net/C2MWN/

當你想改變一個元素的CSS，你需要使用style屬性。要確定特定樣式屬性的名稱，CSS名稱將轉換爲駱駝大小寫 - 「font-size」變爲「fontSize」，以便標識符在JavaScript中有效。

雖然設置style的屬性絕對有效，雖然這是一個非常簡單的示例，但可能更容易處理添加和刪除class。這在設置多個CSS屬性時特別有用。這個類可以定義爲：

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

而且你會操控text.className財產（和/或classList屬性）。

，取決於您所使用的瀏覽器上，你可以很容易地提供一個更好的描述（那樣明顯，因爲它是我們中的一些）問題的方法通過在瀏覽器中使用JavaScript控制檯。在Firefox中，您可以使用Firebug。在Internet Explorer和Chrome中，您可以使用開發人員工具。如果安裝/啓用，通常可以通過按下鍵盤上的F12來調出。

另外，不要忘了用}關閉功能。

參考：

style屬性：https://developer.mozilla.org/en-US/docs/DOM/element.style
classList屬性：https://developer.mozilla.org/en-US/docs/DOM/element.classList

來源

2013-05-08 14:17:11 Ian

非常感謝！ – user2297666 2013-05-08 14:36:48

如果我想隱藏文本，然後顯示onclick？ – user2297666 2013-05-08 14:37:11

@ user2297666要隱藏它，請更改'display'樣式屬性。像'text.style.display =「none」;'。 – Ian 2013-05-08 14:37:59

下面的代碼

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

使用工作實例http://jsfiddle.net/D2anZ/

來源

2013-05-08 14:19:01

這是一個使用CSS完成你想要的任務的版本。這樣，如果您想同時對不同的文本集進行此操作，並且想要更改該字體大小，則只需要一個位置即可進行更改。（或者如果你還想添加其他CSS屬性（顏色等））

Fiddle

的JavaScript

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

CSS

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

來源

2013-05-08 14:27:10

的JavaScript的onclick功能放大文本

回答

相關問題