Question

我正在尝试迭代一组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/

的小提琴

Answer 1

您希望将URL替换为newURL，而不是将datapath替换为您当前拥有的newURL。

所以：

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);
//}

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

1 个答案: