常連

# 実現したいこと

JavaScriptでmathjaxの数式をhtmlに埋め込みたいです。

# 現在の状況

ボタンを押す前は以下のように表示されます。

![ボタン押下前](7fb45e89ad6ec24dd8b835cc8f1f890d.png)

ボタンを押した後、textContentやinnerTextで数式を置き換えるのですが、
mathjaxの効果がありません。

![ボタン押下後](b0bbef4a41985b1a3480c5a69d08d96f.png)

# 試したこと

Asciiコードを使ってみましたが、そのまま`$`になったり変換されなかったりしました。

```
mathArea.textContent = "\x24" + "a" + "\x24";
結果： "$a$"
```

```
mathArea.textContent = '&#36; a &#36;';
結果: "&#36; a &#36;"
```

# 現在のソースコード

```javascript
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Math</title>
</head>
<body>
  <button id="btn">ボタン</button>
  <p>↑ ボタンを押すと平方完成します!</p>
  <div id="math" class="math">
      $y = x^2 - 4x + 2$
  </div>
  <script type="text/javascript" src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
  <script type="text/x-mathjax-config">
    MathJax.Hub.Config({
    TeX: { equationNumbers: { autoNumber: "AMS" }},
    tex2jax: {
      inlineMath: [ ['$','$'], ["$","$"] ],
      processEscapes: true
    },
    "HTML-CSS": { matchFontHeight: false },
    textAlign: "left",
    textIndent: "2em"
    });
  </script>
  <script>
    const btn = document.getElementById('btn');
    const mathArea = document.querySelector('div');
    btn.onclick = function() {
      mathArea.textContent = '$y = (x - 2)^2 - 2$';
      document.querySelector('p').innerText = '平方完成 Complete!!';
      btn.disabled = true;
    }
  </script>
</body>
</html>
```

どうしたらMathJaxで変換されるのか教えて頂けないでしょうか。よろしくお願いいたします。

JavaScriptのtextContentやinnerTextでMathJaxの数式をHTMLに埋め込めない

私がいる最近始まったプロジェクトでは、gitlab にファイルやドキュメントをアップロードします。
ドキュメントはマークダウンで書いてあり、atomで編集しています。また、数式が含まれています。

atom で編集している md を gitlab に上げると、プレビューで上手く表示されません。
詳しくはまだ調べてないのですが、レンダリングの違いによります。

そこで、質問ですが良い解決方はありますでしょうか？
私が考えたのは
(1) 今まで通り atom で github markdown で編集し、アップロードするとき変換する正規表現プログラムを書き、それを通してアップロードする。ただプログラムを書くのも、毎回プログラムを通すのも面倒です。
(2) atom で gitlab markdown に対応する数式パッケージを探し、それをいれる。このパッケージが存在するかは分かりません。よろしければ教えて下さい。
(3) gitlab markdown に対応したエディタを探す。プレビューがあると嬉しいです。もしご存知でしたら教えて下さい。

何か良い解決方があれば教えて下さい。よろしくお願いいたします。

gitlab にアップロードする markdown ファイルの扱い方ベストプラクティスの募集

下と上の両方に添字があるときはどうやって読む?
例えば、xの↓に1、↑に'があるときはどうやって読む?
![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-04-06/0d5fe557-649c-4bb8-9e2c-243a58a8f359.png)

```
153仕様書無しさん2022/04/06(水) 13:31:04.42>>154
https://teratail.com/questions/dz7uvwpqq57ynb
こんなん知恵袋で速攻解決するのになんでteraなんだ？

154仕様書無しさん2022/04/06(水) 13:34:32.21>>155
>>153
そりゃーteratailを荒らしたいからでしょ

155仕様書無しさん2022/04/06(水) 13:44:51.46
>>154
荒らして得られるのは低評価とヘイトだけなんだけどそんなん集めてどうするつもりなんかね
荒らしの心理はわからん
```
だから荒らしじゃないんだって。事情があるんだ。

[至急] 下と上の両方に添字があるときはどうやって読む?

### 前提

ここに質問の内容を詳しく書いてください。
（例）
TypeScriptで●●なシステムを作っています。
■■な機能を実装中に以下のエラーメッセージが発生しました。

ある関数を積分したとき、解が例えばx+1+Cになった場合、x+Cも両方正解ですか？

### 実現したいこと

ここに実現したいことを箇条書きで書いてください。
- [ ] ▲▲機能を動作するようにする

### 発生している問題・エラーメッセージ

```
エラーメッセージ
```

### 該当のソースコード

```ここに言語名を入力
ソースコード
```

### 試したこと

ここに問題に対して試したことを記載してください。

### 補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。


再掲：ある関数を積分したとき、解が例えばx+1+Cになった場合、x+Cも両方正解ですか？

### 前提・実現したいこと

javascriptを使ってクイズのページを作成しています。
（追記）公式ページによれば動的環境での動作には表記の際に必要なメソッドがあることは理解しています。

### 発生している問題・エラーメッセージ
~~数学の問題を表示するためmathjaxを使用したのですが、問題が変わるごとに適用されません。~~
~~最初の問題は反応しているのでjavascriptの書く位置が悪いのかもしれません。~~
~~動的に表示するにはmathjax.typeset()を用いることはご教示いただき、~~
~~いろいろな位置に挿入しましたが問題文が表示されませんでした。~~
現在quiz_show()の最下段に入力されていますが問題文がクリックできなくなりました。

### 該当のソースコード(編集済み)

```html
<head>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js?ver=1.12.4'></script>
<script src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
<script type="text/x-mathjax-config">
    MathJax.Hub.Config({
      TeX: { equationNumbers: { autoNumber: "AMS" }},
      tex2jax: {
        inlineMath: [ ['$','$'], ["$","$"] ],
        processEscapes: true
      },
      "HTML-CSS": { matchFontHeight: false },
      displayAlign: "left",
      displayIndent: "2em"
    });
  </script>
<script>
$(function(){
    var quizArea = $('.quiz_area'); //クイズを管理するDOMを指定
    var quiz_html = quizArea.html(); //もう一度　を押した時に元に戻すため初期HTMLを変数で保管
    var quiz_cnt = 0; //現在の問題数を管理
    var quiz_fin_cnt = 5; //何問で終了か設定（クイズ数以下であること）
    var quiz_success_cnt = 0; //問題の正解数
    
    //クイズの配列を設定
    //answerの選択肢の数はいくつでもOK　ただし先頭を正解とすること(出題時に選択肢はシャッフルされる)
    var aryQuiz = [];
    aryQuiz.push(
        {
            question : '次の式を微分しなさい。$f(x)=2x-3$',
            answer : ['2', '1', '-3', '-2']
        }
        ,{
            question : '次の式を微分しなさい。$f(x)=4x-7$',
            answer : ['4', '1', '-7', '-4']
        }
        ,{
            question : '次の式を微分しなさい。$f(x)=5x-10$',
            answer : ['5', '1', '-10', '-5']
        }
        ,{
            question : '次の式を微分しなさい。$f(x)=5x^2-10$',
            answer : ['$10x$', '$5x$', '5', '-10']
        }
        ,{
            question : '次の式を微分しなさい。$f(x)=-5x-20$',
            answer : ['-5', '2', '1', '-20']
        }
    );
    
    quizReset();
    
    //回答を選択した後の処理
    quizArea.on('click', '.quiz_ans_area ul li', function(){
        //画面を暗くするボックスを表示（上から重ねて、結果表示中は選択肢のクリックやタップを封じる
        quizArea.find('.quiz_area_bg').show();
        //選択した回答に色を付ける
        $(this).addClass('selected');
        if($(this).data('true')){
            //正解の処理 〇を表示
            quizArea.find('.quiz_area_icon').addClass('true');
            //正解数をカウント
            quiz_success_cnt++;
        }else{
            //不正解の処理
            quizArea.find('.quiz_area_icon').addClass('false');
        }
        setTimeout(function(){
            //表示を元に戻す
            quizArea.find('.quiz_ans_area ul li').removeClass('selected');
            quizArea.find('.quiz_area_icon').removeClass('true false');
            quizArea.find('.quiz_area_bg').hide();
            //問題のカウントを進める
            quiz_cnt++;
            if(quiz_fin_cnt > quiz_cnt){
                //次の問題を設定する
                quizShow();
            }else{
                //結果表示画面を表示
                quizResult();
            }
        }, 1500);
    });
    
    //もう一度挑戦するを押した時の処理
    quizArea.on('click', '.quiz_restart', function(){
        quizReset();
    });
    
    //リセットを行う関数
    function quizReset(){
        quizArea.html(quiz_html); //表示を元に戻す
        quiz_cnt = 0;
        quiz_success_cnt = 0;
        aryQuiz = arrShuffle(aryQuiz); //毎回出題の順番をシャッフルしたい場合はここのコメントを消してね
        quizShow();
    }
    
    //問題を表示する関数
    function quizShow(){
        //何問目かを表示
        quizArea.find('.quiz_no').text((quiz_cnt + 1));
        //問題文を表示
        quizArea.find('.quiz_question').text(aryQuiz[quiz_cnt]['question']);
        //正解の回答を取得する
        var success = aryQuiz[quiz_cnt]['answer'][0];
        //現在の選択肢表示を削除する
        quizArea.find('.quiz_ans_area ul').empty();
        //問題文の選択肢をシャッフルさせる(自作関数) .concat()は参照渡し対策
        var aryHoge = arrShuffle(aryQuiz[quiz_cnt]['answer'].concat());
        //問題文の配列を繰り返し表示する
        $.each(aryHoge, function(key, value){
            var fuga = '<li>' + value + '</li>';
            //正解の場合はdata属性を付与する
            if(success === value){
                fuga = '<li data-true="1">' + value + '</li>';
            }
            quizArea.find('.quiz_ans_area ul').append(fuga);
        });
　　　mathjax.typeset()//追記しました。
    }
    
    //結果を表示する関数
    function quizResult(){
        quizArea.find('.quiz_set').hide();
        var text = quiz_fin_cnt + '問中' + quiz_success_cnt + '問正解！';
        if(quiz_fin_cnt === quiz_success_cnt){
            text += '<br>全問正解おめでとう！';
        }
        text += '<br><input type="button" value="もう一度挑戦する" class="quiz_restart p-10">';
        quizArea.find('.quiz_result').html(text);
        quizArea.find('.quiz_result').show();
    }
    
    //配列をシャッフルする関数
    function arrShuffle(arr){
        for(i = arr.length - 1; i > 0; i--){
            var j = Math.floor(Math.random() * (i + 1));
            var tmp = arr[i];
            arr[i] = arr[j];
            arr[j] = tmp;
        }
        return arr;
    }
});
</script>
<link rel="stylesheet" href="quiz1.css">
</head>
<div class="quiz_area">
    <div class="quiz_set">
        第<span class="quiz_no">0</span>問
        <div class="quiz_question"></div>
        <div class="quiz_ans_area">
            <ul></ul>
        </div>
        <div class="quiz_area_bg"></div>
        <div class="quiz_area_icon"></div>
    </div>
    <div class="quiz_result"></div>
</div>
```

### 試したこと

~~問題文に対してのjavascriptの位置を変更しましたが変わりませんでした。~~
mathjax.typeset()の位置を変更するとそれ以降で動かなくなってしまう。

mathjaxを全画面で反映させたいが画面変更で反映されなくなる。

TeXについての質問です。

```TeX
[
|A| = \sqrt{ \sum_{{i = 1}}^{n} {a_{i}}^{2}}
]
```

上のコードでは以下のような数式が表示がされました。
![結果](7ed70cc354343d3b40522e62a549803d.png)

これでもよいのですができれば平方根の形をきれいにしたいです．
```TeX
[
|A| = \sqrt{\smash \sum_{{i = 1}}^{n} {a_{i}}^{2}}
]
```

![イメージ説明](63ae4e1c6e4996f1891737774c3e03c8.png)
\smashを使うと上のように良くはなるのですが、できれば和の記号を一番上の画像のようにしたいです。
何かうまい方法はあるでしょうか？よければ教えていただけると幸いです。

MathJaxのバージョンは2.7.7を使用しています。
宜しくお願い致します。

Mathjaxの平方根をきれいにしたい

なんか、、数学の公理系の話を聞いて、数学の理論を信用できなくなった。公理を証明できない場合があるらしいが、それは方法論的に間違っていると思う。
公理に矛盾、誤りがないことを示すには、どうすればいい?
どうしようもない矛盾が将来見つかるかもしれない。

公理に矛盾、誤りがないことを示すには、どうすればいい? 

### 前提・実現したいこと

[Mathematic Stack Exchange](https://math.stackexchange.com/questions/3000526/evaluating-sum-n-1-infty-frac1n2n12n-1)で数学の質問をするために`MathML`を使いたい。

###試したこと
以前、`MathML`を使うために[Mathplayer](http://www.dessci.com/en/products/mathplayer/download.htm)をダウンロードしました。ダウンロードをしてから**Mathematic Stack Exchange**で質問をしましたが何も進展がありませんでした。
下記のような分数を使いたいのですが`1  2`のようになってしまい分数になりません。
`Mathplayer`はダウンロードしただけなのでもしかしたら設定をしなければいけないのかもしれませんが、もしするのなら何をしなければいけないのか教えてください。
また、`Mathjax`をダウンロードしてもいいと書いてあったのですがそれはそもそもダウンロードの仕方がわかりませんでした。

```MathML
<math xmlns='http://www.w3.org/1998/Math/MathML'> 
<mfrac> <mrow> <mn> 1 </mn> </mrow> <mrow> <mn> 2 </mn> </mrow> </mfrac> </math>
```