Javascript str.替换为 html 字符串

Javascript str.replace with html string

本文关键字：html 字符串 替换 str Javascript      更新时间：2023-09-26

编辑：

为了更详尽：

我有一个由外部服务器端渲染引擎生成的动态页面（ERP解决方案也处理电子商务，糟糕的故事......），它添加了自己的代码部分，如按钮，输入表单等。我不能直接控制它们，但我需要设计它们。所以我正在使用 js 的字符串替换函数，因为我不能使用 php，只能使用 html/js。但是我不知道js，我只是在学习它，在这种情况下，由于缺乏语法/转义知识，我没有工作

。function体内装有

onload="function ()"。

我刚刚在需要替换的代码部分之外添加了一个<div id="replace-input">（在这种情况下是要发送到购物车的物品数量的输入表单）

谢谢

结束编辑

我找不到一个有效的解决方案来替换像 html 字符串一样

<input name="qty" id="qty" size="6" maxlength="6" value="1" class="input">

进入另一个像

<div class="product-qty">
<label for="qty">Qty:</label>
<div class="custom-qty">
<button type="button" class="reduced items" onclick="var result = document.getElementById('qty');   var qty = result.value;  if (!isNaN(qty) &amp;&amp; qty > 1)result.value--; return false;"> <i class="fa fa-minus-square-o"></i> </button> 
<input type="text" name="qty" id="qty" maxlength="12" value="1" title="Qty" class="input-text qty"> 
<button type="button" class="increase items" onclick="var result = document.getElementById('qty');   var qty = result.value;  if (!isNaN(qty)) result.value++;return false;"> <i class="fa fa-plus-square-o"></i> </button>
</div>
</div>

我正在使用这个函数

var str = document.getElementById("replace-input").innerHTML; 
    var res = str.replace(/HereIHaveToAddTheFirstString/g, "HereTheSecondOne");
    document.getElementById("replace-input").innerHTML = res;

但我不知道如何编写字符串以便正确解析。

如果您正在寻找一种将 HTML 代码用作字符串的方法，您可以使用在线工具为您转义字符。之后，您应该使用 DOM 操作来替换这两个元素。如果 jQuery 不是一个选项，你可以做类似的事情

var div = document.createElement('div');
div.className = 'product-qty';
div.innerHTML = "<label for='"qty'">Qty:<'/label>"
+ "<div class='"custom-qty'">"
+ "<button type='"button'" class='"reduced items'" onclick='"var result = document.getElementById('qty');   var qty = result.value;  if (!isNaN(qty) &amp;&amp; qty > 1)result.value--; return false;'"> <i class='"fa fa-minus-square-o'"><'/i> <'/button> "
+ "<input type='"text'" name='"qty'" id='"qty'" maxlength='"12'" value='"1'" title='"Qty'" class='"input-text qty'"> "
+ "<button type='"button'" class='"increase items'" onclick='"var result = document.getElementById('qty');   var qty = result.value;  if (!isNaN(qty)) result.value++;return false;'"> <i class='"fa fa-plus-square-o'"><'/i> <'/button>"
+ "<'/div>";
var container = document.getElementById("replace-input");
var element = document.getElementById("qty");
container.removeChild(element);
container.appendChild(div)
相关文章：