如何追加兩個定位元素

Question

我有兩個錨元素之間一個div：

<a onclick="PostMenuAction('abc');" class="port" title="AddPort" id="lnkPort">port</a> 

和

<a onclick="PostMenuAction('def');" class="crop" title="AddCrop" id="lnkCrop">crop</a> 

現在我想在這兩者之間插入一個小圖像的股利。

所以這將是

<a onclick="PostMenuAction('abc');" class="port" title="AddPort" id="lnkPort">port</a> 
<div id="additionaldiv"> <img src="" id="additional img" /> </div> 
<a onclick="PostMenuAction('def');" class="crop" title="AddCrop" id="lnkCrop">crop</a> 

能否請你幫我添加相同？使用JavaScript

在此先感謝

Answer 1

你在這裏。您可以到這一點的JavaScript函數：

var div = document.createElement("div"); 
var img = document.createElement("img"); 
img.src = "/path/to/image"; 
div.appendChild(img); 
var a = document.getElementById("lnkCrop"); 
a.parentNode.insertBefore(div,a); 

Answer 2

解決了我很高興，如果這在這裏你去：

<a onclick="PostMenuAction('abc');" class="port" title="AddPort" id="lnkPort">port</a> 
<div><img src="small.gif" alt="" /></div> 
<a onclick="PostMenuAction('def');" class="crop" title="AddCrop" id="lnkCrop">crop</a> 

Answer 3

你可以調用JavaScript來做到這一點。以下是執行此功能的方法。

document.getElementById("lnkPort").innerHTML = document.getElementById("lnkPort").innerHTML+'<div><h1>Test</h1></div>'; 

Answer 4

這裏是一個JavaScript函數來做到這一點：

function addImageBefore(path, id) { 
    var div = document.createElement('div'), 
     img = document.createElement('img'), 
     refElement = document.getElementById(id); 

    if (!refElement) {// Presumably atypical, hence not worrying about creating above 
     return null; 
    } 
    img.src = path; 
    div.appendChild(img); 
    refElement.parentNode.insertBefore(div, refElement); 
    return div; 
} 

調用它，你的情況是這樣的：

addImageBefore("path/to/img", "lnkCrop"); 

把在調用無論是什麼事件處理程序或您想要觸發添加的東西。

更多DOM規格：DOM2 Core，DOM2 HTML，DOM3 Core。