是否可以从 HTML 更改 JavaScript 的字体？答案

【问题标题】：Is it possible to change the font of a JavaScript from HTML?是否可以从 HTML 更改 JavaScript 的字体？
【发布时间】：2015-05-27 17:37:48
【问题描述】：

是否可以从 html 代码的 sn-p 更改 JavaScript 中的字体？

我想“强制” JS 显示本地字体，但我无法更改 JS（这不是我的脚本，而且很混乱）。

JS 由填字游戏生成，当您将文件导出到网页时，该填字游戏仅允许您在“times new roman”和“Sans serif”之间进行选择。一切都以小写形式导出，我可以通过使用“text-transform：uppercase”将所有字母变为大写来修复它。为什么不能对字体做同样的事情？（是的；它适用于页面上的其他任何地方）。

这是完整的代码：

<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta NAME="Generator" CONTENT="Crossword Compiler (www.crossword-compiler.com)">

//this is my stylesheet to call @font-face.
<link rel="stylesheet" href="stylesheet.css" type="text/css" charset="utf-8" /> 

//this is from the original code. I've only added 'fatalityregular':
<STYLE TYPE="text/css"
{  "font-family: fatalityregular, Arial, Times, sans-serif";
}></STYLE>

//this whole section looks like this when you export the puzzle to web:
<!--
BODY, .Clues, .GridClues { font-size: -3pt; font-family: 'fatalityregular', Arial, Times, sans-serif;}
-->
<!--
.PuzTitle {
font-size: 15pt; color: #800000; font-weight: bold;
 }
.CopyTag {
font-size: 10pt; color: #000000
 }
-->

</HEAD>

<BODY TEXT="#000000" BGCOLOR="#ffffff">
//this is what I use to fix Times/Arial. With MYFONT I won't need this (it's all uppercase):
<span style="text-transform: uppercase"> 

<script src="CrosswordCompilerApp/jquery.js"></script>
<script src="CrosswordCompilerApp/raphael.js"></script>
<script src="CrosswordCompilerApp/crosswordCompiler.js"></script>
<script src="MyCrossword.js"></script> //This is where I want MYFONT to be used.
<script>
$(function(){
$("#CrosswordCompilerPuz").CrosswordCompiler(CrosswordPuzzleData,null,    
{SUBMITMETHOD:"POST",PROGRESS :  "" , ROOTIMAGES: "CrosswordCompilerApp/CrosswordImages/"  } );});
</script>
<div id="CrosswordCompilerPuz"></div>

</span>

</BODY>
</HTML>

【问题讨论】：

仅供参考， 是 HTML 中的注释。所以其中的任何内容都会被浏览器忽略。
您应该尝试使用 css 而不是 javascript 来对您的页面进行任何样式更改。正如@forgivenson 所提到的，您在头部的css 规则已被注释掉。您应该将评论标签切换为样式标签，例如<style> BODY, .Clues, .GridClues { font-size: -3pt; font-family: 'Font_I_Want', sans-serif; } </style>
感谢您的回答。我已经使用 fontsquirrel 来生成我的字体。它在 stylesheet.css 中。它在任何地方都可以正常工作，除了填字游戏（由我在其中创建填字游戏的程序生成）。难道这里的问题是JS覆盖了其他所有东西？就像我说的，当我将填字游戏导出到网络文件时，我必须在 Times New Roman 或 Sans Serif 之间进行选择。也许我应该更改小程序脚本中的某些内容吗？我不知道如何解决这个问题-.-

标签： javascript fonts

【解决方案1】：

 <span id="my-span" onclick="return change_font();" style="text-transform: uppercase;">Your Text</span>

 <script>
   function change_font(){
     document.getElementById("my-span").style.fontFamily = "Times New Roman";
   }
 </script>

【讨论】：

这也适用于任何地方，除了我需要它工作的地方：p 这里的问题可能是 JS 覆盖了其他所有内容吗？就像我说的，当我将填字游戏导出到网络文件时，我必须在 Times New Roman 或 Sans Serif 之间进行选择。也许我应该改变主脚本中的某些内容吗？问题是我不知道要改变什么以及在哪里改变它。应用程序脚本本身如下所示：FontStyle|FontWeight|LetterUsed|FontSize|float|white|new|ViewHeight|Squares|selected|alphabet|show| 等。我需要一个程序来编辑 JS 吗？（对不起，如果我只是愚蠢的！）
试试这个，让我知道..把这段代码放在你的html上面，让它对你的css很重要
感谢您的帮助！不过，我也无法让它发挥作用。我已经编辑了我的问题，所以现在整个代码都在那里。你能告诉我具体要编辑的部分吗（以防我做得不对）？顺便说一句，当我问到要改变什么以及在哪里改变时，制造商的回答不是很有帮助 - 也许这对你来说比对我来说更重要：“我认为你把风格放在哪里通常并不重要，只要因为它对于您要更改的元素而言是足够具体的。该字体当前可能被小程序字体覆盖，在这种情况下，您可能需要更具体的 css 标记。"
您在样式标签中编写的代码是错误的。在您不提供任何类或 id 名称选择器之前，您的 css 代码将无法工作...所以在您的标签中添加 id 并更改代码在这样的
在任何地方都可以正常工作，但在填字游戏中不行。我想我会放弃的。我可以找到提到字体的唯一 JS 是在“Raphael.js”中，其中显示“font:'10px "Arial"',"font-family":'"Arial"',"font-size" :"10"" 在一片混乱中。