如何使用jquery替换变量中的元素并在另一个变量中获取结果

How to Replace Element In Variable Using jquery And Get Result In Another Variable

本文关键字:变量 另一个 结果 获取 何使用 jquery 替换 元素      更新时间:2023-09-26

我有一个包含HTML内容的变量。类似于下面的"objHtml"变量。

我想用另一个新的div标记替换一个Id为123的div标记。

var objHtml = "<div> " +
"<div id='123' class='class1'>Text1</div>" + 
"<div id='124' class='class1'>Text2</div>" +
"</div>";
// I want to construct this new object using "objHtml", and want to replace div having id = 123 with div having id = 125.
// This Html is in the object and not visible or render on the page. 
var newObjHtml = "<div> " +
"<div id='125' class='class1'>Text5</div>" + 
"<div id='124' class='class1'>Text2</div>" +
"</div>";

有人能回答如何用另一个元素替换变量中的一个元素吗?

$(document).ready(function() {
  var objHtml = "<div> " +
    "<div id='123' class='class1'>Text1</div>" +
    "<div id='124' class='class1'>Text2</div>" +
    "</div>";
  //Create temporary element
  var elem = $(objHtml);
  
  //Find the element and replace it with new HTML
  elem.find('#123').replaceWith("<div id='125' class='class1'>Text5</div>");
  //Read outerHTML property and update your variable or create new variable
  objHtml = elem.prop("outerHTML");
  
  alert(objHtml)
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>