テキスト欄に打ったURLのサムネイル画像を貼りたい

前提・実現したいこと

テキスト欄に貼ったURLをHeartRails Captureを使用してサムネイル画像を下に貼れるようにしたいです。

発生している問題・エラーメッセージ

画像が反映されていない

該当のソースコード

function onButtonClick() {
          target = document.getElementById("output");
          target.innerText = document.forms.form1.textBox1.value;
          //target.innerText = document.form1.textBox1.value;//これでもOK
        }


document.write('<img class="screenshot" src="http://capture.heartrails.com/free?'+screenshot_url+'" alt="'+screenshot_name+'" />');```





   <!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style.css">
    <title>web hozon</title>
    
    <script type="text/javascript">
screenshot_url=("output");
screenshot_name="aaaaa";
</script>

    
    
    
</head>

<body>
   
   <form name="form1" action="">
    <input name="textBox1" type="text" value="" />
    <input type="button" value="Exec" onclick="onButtonClick();" />
  </form>
  <hr />
  <div id="output"></div>
    
    

     <script type="text/javascript" src="hozon.js"></script>
</body>
</html>

コード

試したこと

outputの部分をURLに変えて反映されるか試しましたが、反映されました。```


### 補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

Lhankor_Mhy

2021/09/18 09:01

HTMLの上に書かれているJavaScriptが、hozon.jsだという理解で合っていますか？

行動規範の内容に同意します

回答1件

質問文で提示頂いている onButtonClick() 関数は hozon.js に記載されている、という認識で良いでしょうか？
試しに screenshot_url 変数に代入するようにしてみたところ、サムネイルが表示されることを確認しました。

javascript
1function onButtonClick() {
2      target = document.getElementById("output");
3      target.innerText = document.forms.form1.textBox1.value;
4      screenshot_url = document.forms.form1.textBox1.value;  // 追加
5      document.write('<img class="screenshot" src="http://capture.heartrails.com/free?'+screenshot_url+'" alt="'+screenshot_name+'" />');
6}
7