直接記述されているjavascriptの変数を別ページから取得したい

以下のような構造のhtmlに直接書かれている変数tamaを同一ドメインの別のページからJqueryを使って取得するにはどうすればいいのでしょうか？
読み込まれる側の変数tamaの記述方法は変更できません。

HTML
1<--読み込まれるページ-->
2<!DOCTYPE html>
3<html>
4<head>
5
6<script>
7var tama = "cat";     //tamaを取得したい
8</script>
9
10</head>
11<body>
12
13</body>
14</html>

試したこと

$.ajaxや$.getScriptで出来ないものかと試しましたが直接書かれたscriptの参照方法がわかりませんでした。
よろしくおねがいします。

kei344

2018/10/20 02:53

ご自身で試されたコードを質問文に追記し、「何」が「どのように」わからないのか、コードのどの部分で詰まっているのかなどを具体的に追記されたほうが回答が望めると思います。

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

回答1件

ベストアンサー

$.ajax()で取得したHTMLから、<script>タグ内の文字を取得し、それをJavaScriptコードとして実行することにより、変数tamaの内容を取得できます。

JavaScript
1var executeOtherPageScript = function(){
2
3  //変数tamaがあるページを読み込む
4  $.ajax({
5    type: "GET",
6    url: "hoge.html",  //変数tamaがあるページのURL
7    dataType: "html"
8  }).done(function(htmlText){
9
10    //DOMパーサーの準備
11    if(!window.DOMParser) {
12      console.warn("DOMParserを使用できません。");
13      return;
14    }
15    var domParser = new DOMParser();
16
17    //取得したHTMLをDOM要素に変換する
18    var domTree = domParser.parseFromString(htmlText, "text/html");
19
20    //<script>タグ内のコードを文字列として取得する
21    var scriptCode = $(domTree).find("script").text();
22
23    //文字列をJavaScriptコードとして実行する
24    eval(scriptCode)
25
26    console.log(tama)  //"cat"
27  });
28
29};
30
31
32$(function(){
33  executeOtherPageScript();
34});