消除多次列出href的冗余

如何消除多次列出href属性所产生的冗余？（唯一改变的是URL中的id名称/值对）HTML是：消除多次列出href的冗余

<!DOCTYPE html> 
<html> 
<body> 

<div style="border: 2px solid lightgrey;"><iframe name="map" width="100%" height="700" frameborder="5px" scrolling="no" marginheight="0" marginwidth="0" src="https://peachtreecorners.maps.arcgis.com/apps/webappviewer/index.html?id=3bee"></iframe></div> 

<p><a href="https://peachtreecorners.maps.arcgis.com/apps/webappviewer/index.html?id=2c48" target="map">Do I live in Peachtree Corners?</a></p> 
<p><a href="https://peachtreecorners.maps.arcgis.com/apps/webappviewer/index.html?id=270c" target="map">Voting Districts</a></p> 
<p><a href="https://peachtreecorners.maps.arcgis.com/apps/webappviewer/index.html?id=ba01" target="map">Apartments and Subdivisions</a></p> 

</body> 
</html>

在此先感谢！

来源

2017-03-06 Michael

听起来不粗鲁，但我没有看到任何错误 - 这些链接到不同的页面，因此是分开的。任何使用JS的尝试都会使事情复杂化和混淆。 – Scott

_“（唯一改变的是URL中的id名称/值对）”_注意，每个“”元素的'.innerHTML'也是不同的。 – guest271314

使用html的当前方法比编写javascript来实现相同的结果相对简单。考虑到每个<a>元素具有不同的.innerHTML，使用javascript来渲染相同的html将需要在document内写入更多的文本，否定了减少冗余的目标。

在javascript可以创建多维具有值阵列，以设定在href和.innerHTML为每个动态创建<a>元件，使用Array.prototype.forEach()迭代阵列，元件的设置属性，附加元素document

var url = " https://peachtreecorners.maps.arcgis.com/apps/webappviewer/index.html"; 
 
var arr = [ 
 
    ["2c48d68065b541388e262fb4113773af", "Do I live in Peachtree Corners?"], 
 
    ["270c6dc8c47a45b2941e286004b9da2c", "Voting Districts"], 
 
    ["270c6dc8c47a45b2941e286004b9da2c", "Apartments and Subdivisions"] 
 
]; 
 

 
arr.forEach(function(data) { 
 
    var p = document.createElement("p"); 
 
    var a = document.createElement("a"); 
 
    a.href = url + "?=" + data[0]; 
 
    a.target = "map"; 
 
    a.innerHTML = data[1]; 
 
    p.appendChild(a); 
 
    document.body.appendChild(p); 
 
});

来源

2017-03-06 19:17:23 guest271314

我明白了，谢谢！这只是我有几个（十二二）链接添加，并认为它是越来越多... – Michael

你可以存储查询字符串参数和'.innerHTML'设置在一个多维数组，迭代数组，创建数组的每个元素的''元素，然后调用'.appendChild（）'将动态创建的''元素附加到'document'。 – guest271314

@Michael查看更新后的帖子。 – guest271314

如果这些是真正的只有链接在页面上可以使用<base>元素。

这个元素进去文档的头部，并希望这个

<!DOCTYPE html> 
<html> 
<head> 
    <base href="https://peachtreecorners.maps.arcgis.com/apps/webappviewer"> 
<body> 
    <p><a href="/index.html?id=2c48" target="map">Do I live in Peachtree Corners?</a></p> 

...

请记住，如果有其他相对URL的网页上使用，他们将通过基本元素被打乱。

来源

2017-03-06 19:58:37

消除多次列出href的冗余

回答

相关问题