Question

我有1. Html字符串变量2.包含更改的对象

iif([DIM Version].[VCR BK Version].currentmember is [DIM Version].[VCR BK Version].[All],
SUM(TAIL(NonEmptyCrossjoin([DIM Version].[VCR BK Version].MEMBERS,{[DIM Periode].[Hierarchy].CurrentMember})).item(0),[Measures].[MNY_ENCOURS])
,[Measures].[MNY_ENCOURS]);

我想用新内容更新htmlString并将此变量传递给service。最后htmlstring应该像

var htmlString = '\<body>\
                    <div class="shrek">\
                        <div class="trck">Object containing\
                            <div id ="head"> \
                                <strong>Object containing</strong>\
                            </div>\
                        </div>\
                    </div>\
                    <div id ="body"> String Variable String Variable String Variable</div>\
                    <div id ="foot">Similar Questions</div>\
                  </body>'

var obj = {
    'head': '<strong>I</strong> am new head'
}

HtmlString模式可以不同，我如何根据Id更新字符串。

Answer 1

首先要小心你的引号，因为你有几个不匹配的实例。我建议使用'来分隔字符串，以便您可以在其中使用"来界定HTML中的属性值。

要解决您的实际问题，您可以使用Object.keys()从对象中获取包含要搜索的id属性的键，然后循环查找这些键以检索元素并设置{{ 1}}根据需要。试试这个：

＆＃13;

html()

＆＃13;

var htmlString = '<div class="shrek"><div class="trck">Object containing<div id="head"><strong>Object containing</strong></div></div></div><div id="body"> String Variable String Variable StringVariable</div><div id="foot">Similar Questions</div>';
var obj = {
  'head': '<strong>I</strong> am new head'
}

var $html = $(htmlString);
Object.keys(obj).forEach(function(k) {
  $html.find('#' + k).html(obj[k]);
});
$html.appendTo('body');

＆＃13;

Answer 2

您可以在内存中创建DOM树，并使用此树以您想要的任何自由进行操作。

parser = new DOMParser(),
doc = parser.parseFromString(xmlString, "text/xml");

在此示例中，您可以按ID查找元素，更新内容，必要时删除，然后生成结果HTML。

var element = doc.getElementById("head");

请参阅以下示例：

＆＃13;

var xmlString = `<body>
<div class="shrek"><div class="trck">Object containing<div id ="head"> <strong>Object containing</strong></div></div></div>
<div id ="body"> String Variable String Variable String Variable</div>
<div id ="foot">Similar Questions</div>
</body>`, 
   parser = new DOMParser(),
   doc = parser.parseFromString(xmlString, "text/xml");
  
var element = doc.getElementById("head");
element.innerHTML = '<strong>I</strong> am new head';

console.log(doc.documentElement.outerHTML);

＆＃13;

Answer 3

首先，你的String无效，因为你有一些双引号。一个简单的解决方法是使用反引号。

然后，您可以通过$(...)将您的String转换为Jquery对象。

然后，您可以循环浏览obj并相应地更新HTML。

var htmlString = `<body>
<div class="shrek"><div class="trck">Object containing<div id ="head"> <strong>Object containing</strong></div></div></div>
<div id ="body"> String Variable String Variable String Variable</div>
<div id ="foot">Similar Questions</div>
</body>`;

var obj = {
'head':'<strong>I</strong> am new head'
}

var html = $(htmlString);

$.each(obj,function(id,val){
  $('#'+id,html).html(val);
});

$('body').append(html);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

如何使用JavaScript更新基于Id的字符串中的Html内容？

3 个答案: