HTML (index.html)：
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" lang="zh-TW" xml:lang="zh-TW"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Jsonp dynamic</title><script type="text/javascript">function codeboxy(json) { document.getElementById("youtubeTitle").innerHTML = json.entry.title.$t;}function getYoutubeTitle() { var removeScript = document.getElementById('jsonScript'); if(removeScript) removeScript.parentNode.removeChild(removeScript); var yid = document.getElementById('yid').value; var script = document.createElement('script'); script.type = 'text/javascript'; script.id = 'jsonScript'; script.src = "http://gdata.youtube.com/feeds/api/videos/" + yid + "?alt=json-in-script&callback=codeboxy"; document.getElementsByTagName('head')[0].appendChild(script);}</script></head><body><input type="text" id="yid" value="Sr3hyvjNp94" /><input type="button" onClick="getYoutubeTitle()" value="Get" /><div id="youtubeTitle"></div></body></html> |
說明：
使用純JavaScript動態在Head產生jsonp script後，呼叫函式更新Youtube之Title資料。
支援IE6、FireFox、Chrome。
沒有留言:
張貼留言