Javascript 转换<；a>；使用jQuery将文本字符串转换为dom元素

如何将链接中的文本转换为html元素

我用

$（'a'）.text（）来定位文本
返回值，但无法将元素添加到其中

我试过这个：

var someText = $('a').text();
var theElement = $('< p >' + someText + '< /p >');
someText.replaceWith(theElement);

var someText=$（'a'）.text（）；
var theElement=$（“”+someText+“
”）；
someText.replacement（元素）；


我知道这可能会在链接中添加一个文本元素，这不是最佳做法，但即使这样也不行

我真正需要的是删除整个文本，并在作为文本元素取消链接后立即重写它

感谢您的帮助。多谢各位

标记：

<li>
<a href="/"> <img src="image.png"> text to be converted to element </a>
</li>




我想要的是：

<li>
<a href="/"> <img src="image.png"></a>
<p> text to be converted to element </p>
</li>


要转换为元素的文本


由于
someText
是字符串，而不是jQuery元素，因此不能对其调用
.replaceWith（）
。试着这样做：

var someLink = $('a');
var someText = someLink.text();
var theElement = $('<p>' + someText + '</p>'); // no spaces inside tags
someLink.replaceWith(theElement);

var someLink=$（'a'）；
var someText=someLink.text（）；
var theElement=$（“”+someText+“
”）；//标记内没有空格
someLink.replacement（元素）；



更新由于您在问题中添加了新信息，以下是满足您需要的解决方案：

var someLink = $('a');
var someText = someLink.text();
var someImg = someLink.find('img');
var theElement = $('<p>' + someText + '</p>');
someLink.html(someImg).after(theElement);

var someLink=$（'a'）；
var someText=someLink.text（）；
var someImg=someLink.find（'img'）；
var theElement=$（“”+someText+“
”）；
html（someImg）.after（元素）；

由于
someText
是字符串，而不是jQuery元素，因此不能对其调用
.replaceWith（）
。试着这样做：

var someLink = $('a');
var someText = someLink.text();
var theElement = $('<p>' + someText + '</p>'); // no spaces inside tags
someLink.replaceWith(theElement);

var someLink=$（'a'）；
var someText=someLink.text（）；
var theElement=$（“”+someText+“
”）；//标记内没有空格
someLink.replacement（元素）；



更新由于您在问题中添加了新信息，以下是满足您需要的解决方案：

var someLink = $('a');
var someText = someLink.text();
var someImg = someLink.find('img');
var theElement = $('<p>' + someText + '</p>');
someLink.html(someImg).after(theElement);

var someLink=$（'a'）；
var someText=someLink.text（）；
var someImg=someLink.find（'img'）；
var theElement=$（“”+someText+“
”）；
html（someImg）.after（元素）；


var-anchor=$（'li a'）；
anchor.after（“”+anchor.text（）+“
”）
.contents（）
.filter（函数（）{
返回（this.nodeType==3）；
})
.remove（）；

在此处找到删除后面文本的代码

var-anchor=$（'li a'）；
anchor.after（“”+anchor.text（）+“
”）
.contents（）
.filter（函数（）{
返回（this.nodeType==3）；
})
.remove（）；

在此处找到用于删除后面文本的代码
使用
.html（）

var someText='Hey！'；
$（'#test'）.html（''+someText+'
'）；

小提琴：
使用
.html（）

var someText='Hey！'；
$（'#test'）.html（''+someText+'
'）；

小提琴：我建议：

// iterate over each of the <a> elements within <li> elements:
$('li a').each(function() {
  // create a <p> element, setting its text
  // to that of the 'this' element (the <a>):
  $('<p>', {
    'text': this.textContent
  // insert that created <p> after the current <a> element:
  }).insertAfter(this);

  // filtering the childNodes of the current <a>:
  $(this).contents().filter(function() {
    // keeping only those that are of nodeType === 3
    // and therefore are textNodes:
    return this.nodeType === 3;
  // removing those nodes:
  }).remove();
});

//迭代每个

我建议：

// iterate over each of the <a> elements within <li> elements:
$('li a').each(function() {
  // create a <p> element, setting its text
  // to that of the 'this' element (the <a>):
  $('<p>', {
    'text': this.textContent
  // insert that created <p> after the current <a> element:
  }).insertAfter(this);

  // filtering the childNodes of the current <a>:
  $(this).contents().filter(function() {
    // keeping only those that are of nodeType === 3
    // and therefore are textNodes:
    return this.nodeType === 3;
  // removing those nodes:
  }).remove();
});

//迭代每个

是否尝试使用jQuery选择所有链接？否。我知道如何正确地针对每个元素。谢谢你会用
id
或
class
来定位它们吗？不清楚你在找什么，也许你可以用一个例子来澄清一下你正试图用一个
元素替换一个
元素，包含相同的文本？你正在尝试用jQuery选择所有的链接吗？不。我知道如何正确地定位每个元素。谢谢你会用
id
或
class
来定位它们吗？不清楚你在找什么，也许你可以用一个例子来澄清一下你试图用一个
元素替换一个
元素，包含相同的文本？我不想把链接转换成文本！那么，当您最初发布问题时，您应该更加清楚。在人们已经回答了一个问题之后，完全改变它的参数是不酷的。不管怎样，我已经更新了我的答案以反映你的新代码。我不想把链接转换成文本！那么，当您最初发布问题时，您应该更加清楚。在人们已经回答了一个问题之后，完全改变它的参数是不酷的。无论如何，我已经更新了我的答案以反映您的新代码。谢谢！！happy easterIt无需投票支持（除非其他人希望如此）；如果它解决了你的问题，并且比其他答案更有帮助，你可以自由地接受这个（或任何其他）答案来反映这一点。我很高兴能够提供帮助，但如果你觉得这个（或任何其他）答案回答了你的问题，你的接受（检查勾号字符（
✓）旁边的适当答案）将不胜感激。谢谢！！happy easterIt无需投票支持（除非其他人希望如此）；如果它解决了你的问题，并且比其他答案更有帮助，你可以自由地接受这个（或任何其他）答案来反映这一点。我很高兴能够提供帮助，但如果你觉得这个（或任何其他）答案回答了你的问题，你的接受（检查勾号字符（
✓）旁边的适当答案）将不胜感激。