回答編集履歴

1

追記です。

2018/07/25 06:34

投稿

mix-peach
mix-peach

スコア1910

test CHANGED
@@ -21,3 +21,145 @@
21
21
  質問の書き方の話ですが、
22
22
 
23
23
  見て欲しいコード(htmlも)は、スクショではなく、きちんと文字列で掲載した方が良いですよ!
24
+
25
+
26
+
27
+ ----
28
+
29
+ 【追記】
30
+
31
+
32
+
33
+ どうやって気づいたか、について・・・
34
+
35
+
36
+
37
+ WEBサイトのページで、表示されているHTMLのコードを確認する2つの方法の「差」を
38
+
39
+ 覚えておくと便利です。
40
+
41
+
42
+
43
+ ①ブラウザの開発ツールを使って、確認
44
+
45
+ ②見ているページで、「右クリック」⇒「ソースを表示」で確認(だいたい別タブとかで開きます)
46
+
47
+
48
+
49
+ この2つを比較すると、ソースが異なっていることがあります。
50
+
51
+ それは、
52
+
53
+ ①は、
54
+
55
+ ページを開いてから、クライアント側(ブラウザ内)で行われた処理も含めて、ほぼリアルタイムでソースとして表示される
56
+
57
+ のに対し、
58
+
59
+ ②は、
60
+
61
+ ページを開いた直後の最初のソースしか表示しない
62
+
63
+ からです。
64
+
65
+
66
+
67
+ 今回の場合で言えば、
68
+
69
+ ①には、該当ボタンのソースがありますが、 ②では、見つかりません。
70
+
71
+ つまり、
72
+
73
+ 「ページを開いた後に、クライアント側(ブラウザ内)で行われた処理によって、このボタンが生成された」
74
+
75
+ という判断ができます。
76
+
77
+
78
+
79
+ クライアント側(ブラウザ内)で、HTMLを変更できるような処理といえば、だいたいjavascriptです。
80
+
81
+ あとは、どこに記述されたjavascriptで、この処理がおこなわれているのか、を見つけられれば良いわけです。
82
+
83
+
84
+
85
+ 逆に、①にも②にも該当ボタンのソースが記述されていれば、「ボタンはサーバー側で生成されてブラウザに表示された」ということになりますので、htmlファイルの該当ボタンのコードが「あるべき近辺」に、別ファイルを読み込むような記述があるとか、プログラムコードが直接記述されているとか。。「何か」が絶対にある筈なのです。
86
+
87
+
88
+
89
+ ---
90
+
91
+ ここからは、今回どんな感じで探していったか、という細かい話。。。
92
+
93
+
94
+
95
+ javascriptが犯人っぽいので、htmlファイルの中から、<scrip>タグを探します。
96
+
97
+
98
+
99
+ <head>内に2か所
100
+
101
+ ```html
102
+
103
+ <script src="//code.jquery.com/jquery-1.10.2.min.js"></script>
104
+
105
+ <script src="//code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.js"></script>
106
+
107
+ ```
108
+
109
+ <body>の後ろの方に1か所
110
+
111
+ ```
112
+
113
+ <script type="text/javascript" id="mfpjs" src="mailformpro/mailformpro.cgi" charset="UTF-8"></script>
114
+
115
+ ```
116
+
117
+
118
+
119
+ <head>内で読み込んでいる**jquery-1.10.2.min.js**は、jqueryを使う為のベースとなるファイルです。
120
+
121
+ **jquery.mobile-1.4.0.min.js**は、名前からjqueryの拡張ライブラリだと分かります。
122
+
123
+ これらは、「メールフォームプロ用」のファイルではありませんし、これではないだろうな、と判断できます。
124
+
125
+
126
+
127
+ 残るは、<body>の後ろの方で読み込まれている**mailformpro/mailformpro.cgi**です。
128
+
129
+ 名前からして、「メールフォームプロ」のファイルっぽいですね!
130
+
131
+
132
+
133
+ 一応、中身も見てみたりします。
134
+
135
+
136
+
137
+ javascriptで、htmlのパーツを操作する場合、class属性やid属性の値を用いて行うことが多いのですが、特にシステムとして提供されているものは、ある程度分かりやすく「それっぽいid」「それっぽいclass」になっていることが多いです。
138
+
139
+
140
+
141
+ <form>タグには、それっぽい id="mailformpro" があります。
142
+
143
+
144
+
145
+ そして、質問対象となっている htmlには見当たらない、「ボタン」も
146
+
147
+ ```html
148
+
149
+ <button class="mfp_next ui-btn ui-shadow ui-corner-all">個人情報 へすすむ ></button>
150
+
151
+ ```
152
+
153
+ それっぽいクラス **mfp_next** が居ます。
154
+
155
+
156
+
157
+ あとは、**mailformpro/mailformpro.cgi**の中で、**mfp_next**を検索してみたりして、
158
+
159
+ javascriptをある程度読むことができるのであれば、「ボタンを作る処理」があるのが分かります。
160
+
161
+ (これには、プログラムというものに対する「慣れ」のようなものも、必要かもしれないですが...^^;)
162
+
163
+
164
+
165
+ ということで、今回の回答に辿り着いたのでした。。。