消除多次列出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的冗餘

回答

相關問題