How to add table in web page using mathjax

Question

I am a beginner. I am trying to build a table using math Jax but it can't compile. how can I add a table?

\begin{center}
    \begin{tabular}{ | m{7em} | m{5em}| m{9em} | } 
            \hline
        Set & operation & Identity \\ 
            \hline
        \(\mathbb{Z}\) & \(+\) & \(0\)    \\
            \hline
        \(\mathbb{Q}\) & \(+\) & \(0\)    \\
            \hline
        \(\mathbb{R}\) & \(+\) & \(0\)    \\ 
            \hline

        \(\mathbb{Z}\) & \(\times \) & \(0\)    \\
            \hline
        \(\mathbb{Q}\) & \(\times\) & \(0\)    \\
            \hline
        \(\mathbb{R}\) & \(\times\) & \(0\)    \\ 
            \hline
    \end{tabular}
\end{center}

Answer 1

MathJax only implements the macros used for math layout, not text layout, so things like \begin{tabular} and \begin{center} are not supported. Instead, you can use an array environment, like:

<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/latest.js?config=TeX-AMS_CHTML-full"></script>

\[
\begin{array}{|c|c|c|}
\hline
  \text{Set} & \text{Operation} & \text{Identity} \\ 
\hline
   \mathbb{Z} & + & 0 \\
\hline
   \mathbb{Q} & + & 0 \\
\hline
   \mathbb{R} & + & 0 \\ 
\hline
   \mathbb{Z} & \times & 1 \\
\hline
   \mathbb{Q} & \times & 1 \\
\hline
   \mathbb{R} & \times & 1 \\ 
\hline
\end{array}
\]

On the other hand, it may be better to use an HTML table with math inside it rather than trying to use MathJax to do the entire table.

Answer 2

I made a table generator for MathJax using MathJax's array : https://isaurssaurav.github.io/mathjax-table-generator/

Usage:

1. Add required columns and Rows.
2. You can add values to cells when table appears
3. Click Generate button to generate a mathjax code for table.

Repo Link :https://github.com/isaurssaurav/mathjax-table-generator ( Any changes are welcome )