使用JavaScript快速更改字體大小

Question

我正在開發ac＃應用程序。 我們使用xsl將xml內容轉換為html。 一旦文件轉換為HTML。 我想通過單擊1 2和3來更改字體大小。因此，如果用戶單擊1字體大小為9pt，則單擊2 11pt並單擊3則為13pt。 我可以使用javascript嗎？ 是否可以在xsl內添加該javascript函數，以便在文件轉換為html時具有該javascript功能？ 如果您回答此問題，請嘗試全面解釋。 提前致謝。

Answer 1

假設您正在將內容呈現到某種容器中，例如跨度，那么您應該能夠執行以下操作：

編輯 ：
如果用戶能夠選擇下拉菜單的大小或其他內容，請將選項值設置為以磅為單位的實際大小。

changeFontSize = function(size){
    var el = document.getElementById("container");
    if (el){
        el.style.fontSize = size + "pt";
    }
}

Answer 2

1. 這是純Javascript中的詳細更改字體大小 （即沒有JQuery）；
2. 您可以在xsl內添加該javascript函數，但不能直接導入 。

Answer 3

首先，在理論上是可能的。 但是，您需要首先確保一些事項。

1. 確保頁面上的字體都是相對字體。 這意味着所有內容都應使用字體大小，例如100％，150％，1.2em等，而不是12px，10pt等。
2. 確保您的腳本是HTML中最后加載的節點，或者正文的onload事件觸發了用於更改文本的函數。

這個過程很簡單。 您可以創建一個函數來更改body元素的字體大小。 因為其他所有內容都是相對的，所以這將影響每個元素。 （例如，將主體字體設置為12px將使設置為150％的任何內容均為18px）。

一個簡單的函數可以像這樣：

function changeFont(sizeInPixels)
{
    document.body.style.fontSize = sizeInPixels + "px";
}

然后只需將功能作為事件添加到具有適當參數的按鈕/鏈接即可。

Answer 4

您需要將JavaScript插入CDATA中。 否則，它只是在編寫更改主體的fontSize樣式大小的錨點。

<![CDATA[ 
<script> 
window.onload = function() {

  var fontchange = document.createElement("div");
  var fontchangelink = function(fontsize, desc) {
      var a = document.createElement('a');
      a.href="#";
      a.style.margin = "5px";
      a.onclick = function() { 
        document.body.style.fontSize = fontsize + 'pt';
      };
      a.innerHTML = desc;
      return a;
  };
  fontchange.appendChild(document.createTextNode("Change font size:"));
  fontchange.appendChild(fontchangelink(9, "1"));
  fontchange.appendChild(fontchangelink(11, "2"));
  fontchange.appendChild(fontchangelink(13, "3"));    

  document.body.insertBefore(fontchange, document.body.childNodes[0]);
};
</script> 
]]> 

您可以設置更好的樣式，但外觀如下：