Question

我有一个包含数学的字符串。我需要将数学标记包裹在一个范围内，然后将字符串放回去。我已经针对特定情况完成了此操作，但是我正在寻找更简单（如果有）并且更有效的方法来完成此操作。例如，如果在Math Tag之前有文本，则此功能将无效；或者，如果有多个Math标签，则此功能将无效。感谢您提供的任何帮助。

字符串

<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn><mo>&#xA0;</mo><msqrt><mn>34</mn></msqrt></math> I am text after the string.

所需的字符串

<span class="math math-inline"><math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn><mo>&#xA0;</mo><msqrt><mn>34</mn></msqrt></math></span> I am text after the string.

到目前为止的解决方案

let spanStart = '<span class="math math-inline">';
let spanEnd = '</span>';
let mathStart = '<math';
let mathEnd = '</math>';
let startPos = mathString.indexOf(mathStart);
let endPos = mathString.indexOf(mathEnd);

let output = mathString.substr(startPos, 0) + spanStart + mathStart + mathString.substr(mathStart.length, (endPos - mathStart.length)) + mathString.substr(endPos, mathEnd.length) + spanEnd + mathString.substr((endPos + spanEnd.length));

到目前为止，我已经制作了pen to show my solution，但仍然不能一直使用。

例如，如果有：

This is question 2 <math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn><mo>&#xA0;</mo><msqrt><mn>34</mn></msqrt></math> I am text after the string.

它将不再正确。谢谢您的帮助

Answer 1

假设<math>标签在<body>内。使用.innerHTML。

var html = document.querySelector('body').innerHTML;
document.querySelector('body').innerHTML = `<span class='math math-inline'>${html}</span>`;

.math {font-family: consolas; font-style:italic; color:red}

<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn><mo>&#xA0;</mo><msqrt><mn>34</mn></msqrt></math>

Answer 2

这是我基于@Lewsi评论的解决方案

function wrapMath (string) {
  if (typeof string !== 'string') return false
  if (!checkForMath(string)) return false

  const spanStart = '<span class="math math-inline">'
  const spanEnd = '</span>'

  return string.replace(/<math/g, spanStart + '<math').replace(/<\/math>/g, spanEnd)
}

let string = 'This is my string <math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn><mo>&#xA0;</mo><msqrt><mn>34</mn></msqrt></math> I am text after the string.
'

wrapMath(string)

// Output
'This is my string <span class="math math-inline"><math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn><mo>&#xA0;</mo><msqrt><mn>34</mn></msqrt></math></span> I am text after the string'

拆分字符串并将数学标签包装在该字符串中

2 个答案: