Question

我知道我可以在javascript中将字符串传递给replace_str方法。

但我真正想要的是能够传递变量以使其变得动态。问题是，每当我尝试将变量传递给方法时，它都无法工作。

我来自php，用substr_replace();方法很容易做到这一点。现在javascript中的等价物是什么。

这是我的代码：

<p>Click to test the result.</p>

<button onclick="myFunction()">Try it</button>

<p id="demo"></p>

＆＃13;

function myFunction() {
  
    var full_string = "http://ok.ru/video/42597812745";
    var code = full_string.substr(19, 11);

    //Testing if this is working
    //document.getElementById("demo").innerHTML = code;

    r_frame = '<iframe width="600" height="400" src="//ok.ru/videoembed/41680046601" frameborder="0" 		allowfullscreen></iframe>';

    var str_to_be_replaced = r_frame.substr(57, 11);
    //Testing if this is working
    //document.getElementById("demo").innerHTML = str_to_be_replaced;
  
  var res = str.replace(code, str_to_be_replaced);
  document.getElementById("demo").innerHTML = res;
  //Not working
}

＆＃13;

<p>Click to test the result.</p>

<button onclick="myFunction()">Try it</button>

<p id="demo"></p>

＆＃13;

Answer 1

在您的代码中，您执行了var res = str.replace(code, str_to_be_replaced);，但在任何地方都没有定义str变量..

我认为你想要的是

var res = full_string.replace(code, str_to_be_replaced);

或

var res = r_frame.replace(str_to_be_replaced, code);

Answer 2

根据您要完成的内容，我收集您要替换src属性的网址。我创建了一个使用.replace()和regex来搜索和替换以下内容的函数：

src=" 这将被替换 "

这是片段的核心：

var str = str.replace(/src\=['"][^'"]*['"]/g, 'src="' + rep + '"');

<强>段

var out1 = document.getElementById('out1');
var inp1 = document.getElementById('inp1');
var inp2 = document.getElementById('inp2');
var inp3 = document.getElementById('inp3');

inp1.addEventListener('click', function(e) {
  var str = inp2.value;
  var rep = inp3.value;
  var res = swapSrc(str, rep);
  out1.textContent = res.toString();
}, false);


function swapSrc(str, rep) {
  var str = str.replace(/src\=['"][^'"]*['"]/g, 'src="' + rep + '"');
  console.log(str);
  return str;
}

//var str = '<iframe width="600" height="400" src="//ok.ru/videoembed/41680046601" frameborder="0" allowfullscreen></iframe>';

//var rep = '//ok.ru/video/42597812745';

body {
  font: 400 14px/1.45'Verdana';
  background: #333;
  color: #fc3;
}
fieldset {
  width: 600px;
  margin-top: 50px;
}
legend {
  font-size: 1.25em;
  margin-bottom: 15px;
}
input {
  width: 30ex;
  font: inherit;
  color: #000;
}
label:last-of-type {
  font-size: .75em;
}
output {
  color: #e0e;
  font-family: 'Consolas'
}
code {
  background: darkblue;
}
.red {
  color: red;
  font-size: 1.2rem;
}

<fieldset>
  <legend>Test the provided strings below or enter your own<span class="red">*</span></legend>
  <input id="inp2" value="<iframe width='600' height='400' src='//ok.ru/videoembed/41680046601' frameborder='0' allowfullscreen></iframe>" />&nbsp;
  <input id="inp3" value="//ok.ru/video/42597812745" />&nbsp;
  <button id="inp1">TEST</button>
  <br/>
  <br/>
  <label for="out1">New String:
    <output id="out1"></output>
  </label>
  <br/>
  <br/>
  <label><span class="red">*</span>Do not wrap data in quotes</label>
</fieldset>

在javascript

2 个答案: