英語アプリ:英和辞典サイトから任意の英単語の発音記号をスクレイピングで取得する
http://ejje.weblio.jp/content/english
のサイトの発音記号 íŋglɪʃ
をとってきたいんです。よ。
参考記事A
Javascriptスクレイピング!jquery.xdomainajax.js-ITかあさん
参考記事B
【jQuery】jQueryの形と、呼び出し方 - Qiita
参考記事Aでは、jqueryによるスクレイピング方法を知りました。
参考記事Bでは、jqueryをonclickイベントで起動させる方法を知りました。
結果は、以下の通りです。
url https://dl.dropboxusercontent.com/u/1006130/english/index_jquery.html
(httpsなので、エラーになります。 ダウンロードしてパソコンで動かせば動きます。)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js"></script> <script type="text/javascript" src="./js/jquery.xdomainajax.js"></script> <script type=text/javascript> // $(document).ready(function(){ // $.ajax({ function getContent(){ $(function(){ var word = document.getElementById("word1").innerHTML; //var word = "english"; var url = "http://ejje.weblio.jp/content/" ; var content =""; $.ajax({ url: url + word, //http:から始まるURLを指定 type: 'GET', success: function(res) { content = $(res.responseText).find('.phoneticEjjeDesc').text();//クラス名やID、タグをfindの中に指定 console.log("content(発音記号) : " + content + " word : " + word ); //document.getElementById("content").textContent = "[ " + content + " ]"; document.getElementById("content").innerHTML = "<b>[ " + content + "] </b>"; } }); }); } </script> </head> <body> <b>http://ejje.weblio.jp/content/ から発音記号を取得する。</b> <br> <br> 英単語 <span id="word1">english</span> <br> 発音記号 <span id="content"></span> <br> <input type="button" onclick='getContent()' value="Get"> </body> </html>