使用字符串替换迭代数据集

Iterate over dataset with string replace

本文关键字：迭代 数据集 替换 字符串      更新时间：2023-09-26

我正在尝试迭代一组li元素，并将其数据集属性替换为字符串。

问题是，我只想替换与另一个字符串匹配的部分，然后保留其数据集的其余部分完整。

HTML是这样的:

<ul class="myUL">
   <li data-path="http://example.com/test1/">Link1</li>
    <li data-path="http://example.com/test1/test2">Link2</li>
    <li data-path="http://example.com/test1/test2/test3">Link1</li>
</ul>

下面是我要做的:

var UL = document.querySelector('.myUL');
var children = UL.getElementsByTagName("li");
var URL = "http://example.com/test1/";
var newURL = "http://example.com/replaced/";
for (i = 0; i < children.length; ++i) {
   var li = children[i];
   var datapath = li.dataset.path;
   if(datapath.match(URL)) {
        li.dataset.path = datapath.replace(datapath, newURL);
    }
}

但是，这只是用字符串替换整个URL。我只想替换与字符串匹配的部分。所以输出应该是这样的:

<ul class="myUL">
   <li data-path="http://example.com/replaced/">Link1</li>
    <li data-path="http://example.com/replaced/test2">Link2</li>
    <li data-path="http://example.com/replaced/test2/test3">Link1</li>
</ul>

如果有人能提供一些帮助，我将非常感激。我希望有一种方法可以从.match()语句中获取剩余的内容，然后我可以简单地将其附加到新的URL。

这是我正在制作的小提琴http://jsfiddle.net/JLCMB/4/

您想用newURL替换URL，而不是用newURL替换datapath。

: 

li.dataset.path = datapath.replace(datapath, newURL);

就变成:

li.dataset.path = datapath.replace(URL, newURL);

见http://jsfiddle.net/JLCMB/5/

我还建议你在执行这行之前不需要if语句。

//if(datapath.match(URL)) {
    //should work fine just with this
    li.dataset.path = datapath.replace(URL, newURL);
//}
相关文章：