javascriptファイルがdomにある場合のターゲット要素の指定方法

Question

紹介プログラムのコードは、紹介者が自分のページにjavascriptファイルを配置して、ロゴを表示させたい場合に使用します。 ASPスクリプトの中で何かのような...

<script type="text/javascript" src="https://www.oursite.com/refer.js.asp?var=1"></script> 

が、それは単にコードのようにビット...テストページで実行している場合、これは動作しますが

document.write('<a href="oursite.com?referrer=somereferrer"><img src="logo.png"></a>'); 

を書き出し、私は状況を発見しました私はこのエラーが出る場所 -

Failed to execute 'write' on 'Document': It isn't possible to write into a document from an asynchronously-loaded external script unless it is explicitly opened. 

を私は動的ユーティリティページを経由してスクリプトを生成し、ページ上のdivにそれを追加しようとすると、私はエラーを取得します。ページが既にロードされているので、私はスクリプトファイルでdocument.writeを使用することはできません。だから、私は思ったんだけど何、のようなものを使用して適切な場所にあるリンクや画像を配置するためにDOM内に位置していますどこスクリプトファイルを判断することができる方法...これで

var a = document.createElement('a'); 
var img = document.createElement('img'); 
img.src = img_url; 
a.appendChild(img); 
a.href = "http://www.oursite.com"; 
document.body.appendChild(a); 

があります私はa要素を直接ボディに追加しています。私ができる必要があるのは、スクリプトファイルを含む要素にそれを追加することです。それは可能ですか？もしそうなら、どうですか？ありがとう。

Answer 1

あなたのscript要素にidを追加し、スクリプト内のそのidを使用することができます。

<script id="a1" type="text/javascript"> 
 
window.addEventListener('DOMContentLoaded', function() { 
 
    var img = document.createElement('img'); 
 
    img.src = 'https://dummyimage.com/600x400/000/fff'; 
 
    document.getElementById('a1').nextSibling.parentNode.insertBefore(img, document.getElementById('a1').nextSibling); 
 
}); 
 
</script>

Answer 2

あなたはまず、ドキュメント上のすべてのスクリプトタグを探してみてくださいSRCを経由して、あなたを見つけることができます一致し、親に追加します。

例：それは静的でない場合、あなたはまた、あなたのsrc URLのために一致する正規表現を使用することができ

var scriptTags = document.getElementsByTagName('script'); 
for(var i=0; i<scriptTags.length; i++) { 
    if(scriptTags[i].src === "your script's href") { 
    var parent = scriptTags[i].parentNode; 
    //append your image/link to parent via parent.insertBefore(YOURNODE, scriptTags[i]) 
    break; 
    } 
}