javascript-将iframe标记环绕<；td>；单元格内容值_Javascript_Iframe_Html Table

javascript-将iframe标记环绕<；td>；单元格内容值

javascript iframe

javascript-将iframe标记环绕<；td>；单元格内容值,javascript,iframe,html-table,Javascript,Iframe,Html Table,我有一个标签，里面有一个url，我想把放在url周围，这样url就会显示在像youtube这样的iframe中 html: https://www.youtube.com/ iframe 函数myFunction（）{ var x=document.queryselectoral（“td.vid”）； x、 outerHTML=“”； } 最初，控制台不断返回长度为0的节点列表。出于某种原因，在进行了一些测试之后，控制台不再返回消息（我使用的是Edge）如何才能正确地获取td的innert

我有一个

标签，里面有一个url，我想把

放在url周围，这样url就会显示在像

youtube

这样的iframe中

html:


https://www.youtube.com/
iframe
函数myFunction（）{
var x=document.queryselectoral（“td.vid”）；
x、 outerHTML=“”；
}

最初，控制台不断返回长度为0的节点列表。出于某种原因，在进行了一些测试之后，控制台不再返回消息（我使用的是Edge）

如何才能正确地获取td的innertext/textcontent并在其周围放置iFrame？

需要指出的几点。在此处列出的特定示例中，无法获取元素数据，因为“td”元素未附着到表。您的实际代码可能不同

关于iframe包装器，如果您只创建一个iframe元素，更改元素的src并将其附加到'td'元素，那么对我来说就更容易了。如果需要，也可以使用JS删除文本

<!DOCTYPE html>
<html>
<body>

<table>
  <td class='vid'>https://www.youtube.com/</td>
</table>


<button onclick="myFunction()">iframe</button>

<script>
function myFunction() {
  var x = document.getElementsByClassName("vid");
  var xElm = x[0]
  let frame = document.createElement('iframe');
  frame.src = xElm.innerHTML;
//now remove the text
  xElm.innerHTML = "";
//now attache the iframe.
  xElm.append(frame);
}
</script>

</body>
</html> 
``


https://www.youtube.com/
iframe
函数myFunction（）{
var x=document.getElementsByClassName（“vid”）；
var xElm=x[0]
让frame=document.createElement（'iframe'）；
frame.src=xElm.innerHTML；
//现在删除文本
xElm.innerHTML=“”；
//现在连接iframe。
附加（帧）；
}
``

td元素必须放在

表

元素中才能工作

检查这个例子

函数myFunction（）{
var x=document.querySelector（“.vid”）；
x、 outerHTML=“”；
}


https://www.youtube.com/
iframe

您是否有多个“td.vid”元素？因为您得到的是一个带有querySelectorAll的数组，如果它是唯一的数组，那么您可以使用querySelector查找第一个匹配项。@user1738483，它不是一成不变的，可能会有多个td.vid元素。我的javascript似乎无法正确地将它们作为目标，但您必须循环使用所针对的类的所有元素。现在，'x'是一个HTMLCollection，所以要瞄准它的第一个元素，您必须执行x[0]例如。。。

<!DOCTYPE html>
<html>
<body>

<table>
  <td class='vid'>https://www.youtube.com/</td>
</table>


<button onclick="myFunction()">iframe</button>

<script>
function myFunction() {
  var x = document.getElementsByClassName("vid");
  var xElm = x[0]
  let frame = document.createElement('iframe');
  frame.src = xElm.innerHTML;
//now remove the text
  xElm.innerHTML = "";
//now attache the iframe.
  xElm.append(frame);
}
</script>

</body>
</html> 
``