javascript - 如何从javascript中的普通文本获取src值

Question

从普通文本获取 src 值而无需在 javascript 中实例化 dom 对象的最佳方法是什么。下面是我尝试过的代码。请提出我所缺少的内容

function validate() {
  var test = document.getElementById("iframe_url").value;
  alert("==>" + test)
}

<input type="text" id="iframe_url" name="iframe_url" value="<iframe   width='420' height='315'    src='https://www.youtube.com/embed/XGSy3_Czz8k'></iframe>" />
<button id="opener" onclick="validate()">Open Dialog</button>

Answer 1

您可以使用 src= 分割文本值，然后再次按空格或 > 分割以标识新属性或结束标记

代码

function validate() {
  var test = document.getElementById("iframe_url").value;
  var src = test.split('src=')[1].split(/[ >]/)[0]
  alert("==>" + src)
}

<input type="text" id="iframe_url" name="iframe_url" value="<iframe   width='420' height='315'    src='https://www.youtube.com/embed/XGSy3_Czz8k'></iframe>" />
<button id="opener" onclick="validate()">Open Dialog</button>

说明

测试有以下字符串

 <iframe width='420' height='315' src='https://www.youtube.com/embed/XGSy3_Czz8k'></iframe>

现在string.split采用字符串或正则表达式来分割关联的字符串。在我们的例子中，我们首先向它提供 string(src=)。这将以以下方式分割字符串

["<iframe width='420' height='315'", "'https://www.youtube.com/embed/XGSy3_Czz8k'></iframe>"]

我们可以放弃第一个条目，因为我们只想要它的值。因此，我们选择第二个条目，并再次使用正则表达式将其拆分。

string = "'https://www.youtube.com/embed/XGSy3_Czz8k'></iframe>"
split value = [
  "'https://www.youtube.com/embed/XGSy3_Czz8k'",
  "</iframe>"
]

第一个值是我们需要的值。