動的URLをhrefに挿入する方法

Question

動的URLを生成してHTMLタグに挿入し、.innerHTMLプロパティを使用してページに追加する方法を検討しています。

for (n = 0; n <= allImages.length - 1; n++) { // This cycles through all the images on the page. 
 

 
    function getUrl() { 
 

 
    var srcUrl = document.images[n].src; 
 
    return srcUrl; // Then I get the src URL for each image and return it. 
 

 
    } 
 

 
    var newP = document.createElement('p'); 
 
    newP.innerHTML = document.images[n].naturalWidth + " x " + document.images[n].naturalHeight + " " + '<a href= \'javascript:window.location=getUrl();\'>LINK</a> '; // Run the 'getURL' function so the word LINK directs the viewer to the specific image URL. 
 

 
    imgUrlDiv.appendChild(newP); // Append the code each time to a new <p> 
 
}

私はに実行している問題は、のgetURL関数は「HREF」の値として追加されているので、それは引用符でなければならないことであるので、それを文字列にturneます（私の推測）、それはそのままレンダリングされ、正しいイメージURLを取得しません。

hrefの値にgetURL関数を挿入し、ページ上の各イメージへのリンクをレンダリングする方法はありますか？

<a href= \'javascript:window.location=getUrl();\'>LINK</a> 

これらは私が通じ見てきたが、これを解決することができていないリソースの一部です：高度で本当にありがとうございました

• Set iframe url based on dynamic Url
• Which "href" value should I use for JavaScript links, "#" or "javascript:void(0)"?

！

Answer 1

あなたが使用している場合は要素が

for (var n = 0; n < allImages.length; n++) { 
    var img = document.images[n]; 
    var newP = document.createElement('p'); 
    var newA = document.createElement('a'); 
    var newT = document.createTextNode(img.naturalWidth + " x " + img.naturalHeight + " "); 

    newA.href = img.src; 
    newA.textContent = 'LINK'; 

    newP.appendChild(newT); 
    newP.appendChild(newA); 

    imgUrlDiv.appendChild(newP); 
} 

Answer 2

を作成する際にHREFなどの画像ソースを追加します。

newP.innerHTML = document.images[n].naturalWidth + " x " + document.images[n].naturalHeight + " " + "<a href= '"+getUrl()+"'>LINK</a> "; 

をあなたの新しい段落内のあなたが印刷されるようにあなたが「のgetURL」関数を呼び出すことができます画像の幅と高さの文字列表現を出力し、LINKという単語はビューアに特定の画像URLを指示します。