这是一段模拟html标签的字符串'<p><b> </b>1<u>1<b>1 <i>2</i></b><i>2</i>2</u><i> </i></p>'，用js写出3种方法，找到并清除p标签的innerText的前面和后面的空格，中间的空格不需要去除

问题1: 用js写出3种方法，找到并清除p标签的innerText的前面和后面的空格，中间的空格不需要去除。

答案:
方法一: 使用正则表达式替换

let str = '<p><b> </b>1<u>1<b>1 <i>2</i></b><i>2</i>2</u><i> </i></p>';
let result = str.replace(/<p[^>]*>(.*?)<\/p>/, (match, p1) => {
  return `<p>${p1.trim()}</p>`;
});
console.log(result);

方法二: 使用innerHTML和outerHTML进行替换

let str = '<p><b> </b>1<u>1<b>1 <i>2</i></b><i>2</i>2</u><i> </i></p>';
let tempDiv = document.createElement('div');
tempDiv.innerHTML = str;
let pTag = tempDiv.querySelector('p');
pTag.innerText = pTag.innerText.trim();
let result = tempDiv.innerHTML;
console.log(result);

方法三: 使用DOM操作进行处理

let str = '<p><b> </b>1<u>1<b>1 <i>2</i></b><i>2</i>2</u><i> </i></p>';
let tempDiv = document.createElement('div');
tempDiv.innerHTML = str;
let pTag = tempDiv.querySelector('p');
for (let i = 0; i < pTag.childNodes.length; i++) {
  let childNode = pTag.childNodes[i];
  if (childNode.nodeType === Node.TEXT_NODE) {
    childNode.textContent = childNode.textContent.trim();
  }
}
let result = tempDiv.innerHTML;
console.log(result);