JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptでテキストのフォント色を変更する方法

JavaScriptでテキストのフォントの色を変更するには、fontcolor()メソッドを使用します。このメソッドは、文字列が <font color="color"> タグで囲まれているかのように、指定した色でその文字列を表示します。

fontcolor()メソッドとは

fontcolor()メソッドはStringオブジェクトのメソッドの一つで、引数に色の名前(例:"blue")またはカラーコード(例:"#0000FF")を指定します。実行結果としては、<font color="blue">Demo Text</font> のようなHTMLタグ付きの文字列が返されます。

サンプルコード

次のコードを実行すると、JavaScriptを使ってテキストのフォント色を変更することができます。

<html>
  <head>
    <title>JavaScript 文字列 fontcolor() メソッド</title>
  </head>

  <body>
    <script>
      var str = new String("Demo Text");
      document.write(str.fontcolor("blue"));
      alert(str.fontcolor("blue"));
    </script>
  </body>
</html>

上記のコードでは、変数 str に格納された「Demo Text」という文字列に対してfontcolor()メソッドを呼び出し、「blue」を指定しています。document.write()によって画面には青色のテキストが表示され、alert()では <font color="blue">Demo Text</font> というタグ付き文字列が確認できます。

注意:非推奨となっているメソッド

fontcolor()メソッドは現在非推奨(deprecated)とされており、最新の標準仕様からは削除されています。モダンブラウザでも動作しない可能性があるため、実際の開発では使用を避けるべきです。

代わりに、以下のような方法でテキストの色を変更するのが一般的です。

  • CSSの color プロパティを使用する
  • DOM操作で element.style.color = "blue"; のように設定する

これらの手法は標準化されており、すべてのモダンブラウザで確実に動作します。

  1. 【保存版】テキストの大文字・小文字を一瞬で変換する方法|Word・Googleドキュメント・Mac・オンラインツール対応

    Microsoft WordやGoogleドキュメントで文章を入力した際、「大文字と小文字を間違えて打ってしまった…」という経験はありませんか?「小文字を大文字に(あるいはその逆に)変えたいのに方法がわからない」というお問い合わせを多くいただきます。中には、誤入力した部分を全部消して打ち直そうと考えている方もいますが、実はもっと効率的な解決策があります。幸いなことに、Microsoft Wordをはじめとするほぼすべてのテキストエディタには、選択したテキストの大文字・小文字を変換する機能が標準搭載されています。ITに詳しくない方でも簡単に操作でき、しかもその方法は複数あります。この記事では、そ

  2. Windows 10で文字サイズを変更する方法を徹底解説!状況別の設定手順まとめ

    ディスプレイの解像度やモニターのサイズによっては、Windows 10の文字が小さすぎたり大きすぎたりして、読みにくく感じることがあります。 この記事では、Windows 10の文字サイズを簡単に変更するさまざまな方法を、目的別にわかりやすくご紹介します。 なお、本記事の内容はYouTube動画でも解説していますので、あわせてご覧ください。 Windows 10で文字サイズを変更する基本手順 Windows 10のタイトルバー、メニュー、アイコンなどの文字サイズをまとめて変更するには、以下の手順を実行します。 デスクトップ上の任意の場所を右クリックし、「ディスプレイ設定」を左クリックします