Question

这是我在页面上的标记，非常简单：

data-eng="text"data-eng="text"data-eng="text"data-fr="text"data-fr="text"data-fr="text"data-ger="text"data-ger="text"data-ger="text"

这就是我从上面的标记中所需要的：

<a data-eng="text" data-fr="text" data-ger="text"></a>
<a data-eng="text" data-fr="text" data-ger="text"></a>
<a data-eng="text" data-fr="text" data-ger="text"></a>

如您所见，我需要进行的行数（锚点链接）取决于原始标记中有多少相同的数据属性。 E.g。

data-eng="text"data-eng="text"data-eng="text"data-fr="text"data-fr="text"data-fr="text"data-ger="text"data-ger="text"data-ger="text"

会产生

<a data-eng="text" data-fr="text" data-ger="text"></a>
<a data-eng="text" data-fr="text" data-ger="text"></a>
<a data-eng="text" data-fr="text" data-ger="text"></a>

，而

data-eng="text"data-fr="text"data-ger="text"

会产生

<a data-eng="text" data-fr="text" data-ger="text"></a>

我对如何处理这个问题感到有点难过，有人能给我看一个适用于此的示例代码吗？我试过.wrap和.append但没有运气，我似乎无法完成我需要的行。

Answer 1

我不认为你的方法是一个好主意，但有时候黑客是必要的。你可以采取的一种方法是运行正则表达式。

Something like this fiddle should work.

您可能需要针对您的特定用例修改它，但这应该足以让您入门：）

这里的代码。基本上我们对3种模式进行正则表达式，然后绘制与最小模式数组长度一样多的链接。（匹配返回匹配数组，如果不匹配则返回null。您可能也想添加一些错误检查。）

var cmsOut = 'data-eng="text"data-eng="text"data-eng="text"data-fr="text"data-fr="text"data-fr="text"data-ger="text"data-ger="text"data-ger="text"';

var engDetector = cmsOut.match(/data-eng="text"/g);
var frDetector  = cmsOut.match(/data-fr="text"/g);
var gerDetector = cmsOut.match(/data-ger="text"/g);


var htmlOut = '';
for(i=0;i<engDetector.length;i++){
    if(engDetector[i] && frDetector[i] && gerDetector[i]){
        htmlOut += '<a data-eng="text" data-fr="text" data-ger="text">test</a><br>';       
    }
}

document.getElementById('demo').insertAdjacentHTML('afterbegin', htmlOut);

如何将元素放入另一个（jQuery）？

1 个答案: