js 替换HTML 中<li></li> 下的其中一个 <a></a>的显示内容

可以使用 JavaScript 中的正则表达式和 replace() 方法来实现替换 HTML 中<li></li>下的其中一个<a></a>的显示内容。以下是一个示例代码：

// 获取所有的 <li> 元素
var listItems = document.getElementsByTagName("li");

// 遍历每个 <li> 元素
for (var i = 0; i < listItems.length; i++) {
  // 获取当前 <li> 元素下的所有 <a> 元素
  var links = listItems[i].getElementsByTagName("a");
  // 如果 <a> 元素数量大于等于 2，则替换第一个 <a> 元素的内容
  if (links.length >= 2) {
    links[0].innerHTML = "新的显示内容";
  }
}

在上面的代码中，我们首先通过 `getElementsByTagName("li")` 方法获取页面中所有的 `<li>` 元素，然后遍历每个 `<li>` 元素。对于每个 `<li>` 元素，我们再通过 `getElementsByTagName("a")` 方法获取其中的所有 `<a>` 元素。如果 `<a>` 元素数量大于等于 2，就可以使用 `innerHTML` 属性替换第一个 `<a>` 元素的内容了。

相关问题

用js写出3种方法，解析这段字符串'<h1>xx</h1><p>xx</p><td></td><u></u><ul></ul><b></b><li></li><ol></ol>'，将除了p、ul、ol、li、b、i、u的标签对都替换成p标签，但不需要替换以</开头的标签如</h>

可以使用 JavaScript 中的正则表达式和字符串替换方法来实现这个功能。下面是三种不同的方法：

方法一：使用 replace 方法和正则表达式

const str = '<h1>xx</h1><p>xx</p><td></td><u></u><ul></ul><b></b><li></li><ol></ol>';
const replacedStr = str.replace(/<(?!\/?(p|ul|ol|li|b|i|u)\b)[^>]*>/gi, '<p>');
console.log(replacedStr);

方法二：使用 replace 方法和自定义替换函数

const str = '<h1>xx</h1><p>xx</p><td></td><u></u><ul></ul><b></b><li></li><ol></ol>';
const replacedStr = str.replace(/<[^>]*>/gi, (match) => {
  if (match.match(/<\/?(p|ul|ol|li|b|i|u)\b/)) {
    return match;
  }
  return '<p>';
});
console.log(replacedStr);

方法三：使用 DOM 解析和操作

const str = '<h1>xx</h1><p>xx</p><td></td><u></u><ul></ul><b></b><li></li><ol></ol>';

// 创建一个虚拟的 div 元素
const div = document.createElement('div');
div.innerHTML = str;

// 获取所有标签元素
const elements = div.getElementsByTagName('*');
for (let i = 0; i < elements.length; i++) {
  const tagName = elements[i].tagName.toLowerCase();
  if (!['p', 'ul', 'ol', 'li', 'b', 'i', 'u'].includes(tagName)) {
    const p = document.createElement('p');
    p.innerHTML = elements[i].innerHTML;
    elements[i].parentNode.replaceChild(p, elements[i]);
  }
}

const replacedStr = div.innerHTML;
console.log(replacedStr);

js 替换HTML 中<li></li> 里面的一个 <a></a>的显示内容

可以使用 JavaScript 中的正则表达式和 replace() 方法来实现替换 HTML 中 `<li></li>` 标签中的其中一个 `<a></a>` 元素的内容。以下是一个示例代码：

// 获取所有的 <li> 元素
var listItems = document.getElementsByTagName("li");

// 遍历每个 <li> 元素
for (var i = 0; i < listItems.length; i++) {
  // 获取当前 <li> 元素下的所有 <a> 元素
  var links = listItems[i].getElementsByTagName("a");
  // 如果 <a> 元素数量大于等于 2，则替换第二个 <a> 元素的内容
  if (links.length >= 2) {
    var newContent = "新的显示内容";
    // 使用正则表达式将第二个 <a> 元素的内容替换为新内容
    links[1].innerHTML = links[1].innerHTML.replace(/(.+)/, newContent);
  }
}

在上面的代码中，我们首先通过 `getElementsByTagName("li")` 方法获取页面中所有的 `<li>` 元素，然后遍历每个 `<li>` 元素。对于每个 `<li>` 元素，我们再通过 `getElementsByTagName("a")` 方法获取其中的所有 `<a>` 元素。如果 `<a>` 元素数量大于等于 2，就可以使用 `innerHTML` 属性替换第二个 `<a>` 元素的内容了。在替换之前，我们先定义了一个新的内容变量 `newContent`，然后通过正则表达式将第二个 `<a>` 元素的内容替换为这个新内容。