• 締切済み

XHTMLでJavaScriptを読み込むには

http://www.live.com/ 上記のサイトのソースにある、 <web:binding ... というxhtmlの部分でjsを読み込んでいるようなことをしているのですが、具体的にxhtmlからjsを読み込むにはどうしたらいいのですか? 通常のようにhead内にscriptで追加したら解決する話ですが、xhtmlの部分で追加するだけでjsを読み込むほうが保守性が高いので、宜しくお願いします。

  • XML
  • 回答数2
  • ありがとう数643

みんなの回答

noname#22222
noname#22222
回答No.2

s_husky です。 失礼しました。 <p> <script type="text/javascript" src="script/myscript.js"> </script> </p> と外部スクリプトを参照する方法に関する質問のようでした。 この場合は、src属性で指定するようです。

neosys
質問者

補足

何か勘違いしているようですね・・ <web:add src="jsファイル" type="script"></web:add> このxmlの一行を、どうしたら <script type="text/javascript" src="jsファイル"></script> のような意味になるかを知りたいのです。 あくまで、xmlに関する質問で、htmlに関する質問ではありません。

noname#22222
noname#22222
回答No.1

<?xml version="1.0" encoding="Shift_JIS"?> <!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" xml:lang="ja" lang="ja"> <head>   <meta http-equiv="Content-Type"      content="application/xhtml+xml;charset=Shift_JIS"/>   <title>XXXXXXX &gt; トップ</title>   <meta name="description" content="XXXXXXXXXXXX"/>   <meta name="keywords" content="XXXXXXXXXXXXX"/>   <meta name="author" content="XXXXXXXXX"/>   <meta name="copyright" content="XXXXXX"/>   <link rel="stylesheet" type="text/css" href="css/mystyle.css"/>   <script type="text/javascript" src="script/mylibrary.js"></script> </head> このように、「mylibrary.js などの名前で JavaScript のコードファイルを script 等のフォルダに保存してヘッダー部で読み込みたい」ということでしょうか?

neosys
質問者

補足

回答ありがとうございます。 それですと、通常のヘッダー内からのjsの読み込みになってしまいます。 上記のサイトのソースを見てもらったら分かると思うのですが、ボディー内のxmlで記述された部分でjsファイルが指定されていて、まるでそのjsファイルを読み込んでいるようになっているので、どうやるのかなと思ったのです。 一応ソースコード↓ <web:binding selector="#searchform" type="Start.SearchPump"> <web:defaults> <web:param name="scope" value="web"></web:param> <web:param name="mode" value="1"></web:param> <web:param name="market" value="ja-jp"></web:param> <web:param name="historyurl" value="1.0.7.117/history.htm"></web:param> </web:defaults> <web:references priority="High"> <web:add src="http://stj.live.com/live/js/1.0.7.117/SearchPump.js" type="script"></web:add> <web:add src="1.0.7.117/Const.aspx" type="script"></web:add> <web:add src="http://stj.live.com/live/js/1.0.7.117/defaultloc.js" type="script"></web:add> <web:add src="http://stj.live.com/live/js/1.0.7.117/Proxy.js" type="script"></web:add> <web:add src="http://search.live.com/live/search/searchbox.js?v=3.5" type="script"></web:add> <web:add src="http://search.live.com/live/search/search.css?v=3.5" type="css"></web:add> <web:add src="http://search.live.com/live/search/globals.js?v=3.5" type="script"></web:add> <web:add src="http://search.live.com/live/search/scopes.js?v=3.5" type="script"></web:add> <web:add src="http://search.live.com/live/macro.aspx?v=3.5&op=installed_js" type="script"></web:add> <web:add src="http://stj.live.com/live/loc/1.0.7.117/ja/loc.js" type="script"></web:add><web:add src="http://stj.live.com/live/loc/1.0.7.117/ja/jp/market.js" type="script"></web:add> </web:references> </web:binding>

関連するQ&A

  • firefox+xhtml+javascript

    お世話になっております。 divをweb上でドラッグできるスクリプトを組みました。 Opera9.6,IE6では動いているのですが、Firefoxでは、ある条件下でしか動きません。 ある条件とは、DOCTYPEの宣言がされていないことで、XHTMLにしようとDOCTYPEを宣言すると、動作しなくなってしまいます。 <?xml version='1.0' encoding='UTF-8'?> <!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.1//EN' 'http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd'> <html xmlns='http://www.w3.org/1999/xhtml' xml:lang='ja'> <head> <meta http-equiv='Content-Type' content='text/html; charset=UTF-8' /> <meta http-equiv='Content-Script-Type' content='text/javascript' /> <title>test</title> <script type='text/javascript' src='FILENAME.js'></script> -------- <!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.1//EN' 'http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd'> を消せば動きます。 仮に、DOCTYPEをHTML4.1などにしても動きません。 クオートをシングルからダブルにしても同じです。 動かない状態でも、JS自体は読んで、onload関数の中は見に行っているようです(alertを埋め込んだらでたので) 可能性として、 外部ファイルのJSの書き方に問題があるのでしょうか? それとも、HTML側に問題があるのでしょうか? ソースを見なくても何か考えられることがあれば、教えてください。 よろしくお願いします。

  • XHTMLで外部JSファイルを読み込むには?

    XHTMLで外部JSファイルを読み込むには? よろしくおねがいします。 初歩的ですみません 当方 XHTML+CSSでページを作成し JSファイルを読み込みページのTOPへ移動するスクリプトを 作ったのですがXHTML上では上手くうごいてくれません。。。。 ソースはこちらです。 -------------------------------------------------------------- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <title>てすと</title> <link href="style/stylesheet.css" rel="stylesheet" type="text/css"> <script src="script/top.js" type="text/JavaScript"></script> --省略-- 上記のソースは普通に動作するのですがDOCTYPEの宣言を ------------------------------------------------------------- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <title>てすと</title> <link href="style/stylesheet.css" rel="stylesheet" type="text/css"> <script src="script/top.js" type="text/JavaScript"></script> --省略-- にすると・・・動いてくれません。下段のソースを利用したいのですが 何かJSファイルを読み込む方法はありますでしょうか?? アドバイス頂ければ幸いです。よろしくお願いいたします。

  • JavaScriptのXHTML最適化について

    現在、WEBサイトを制作しております。 SSLを使用していることと W3Cに準拠したXHTML+CSSでサイトを制作している事を ベリサインセキュアドシールと Markup Validation Serviceで取得できるバナーで 掲載したいと考えています。 ところが、W3Cのバナーを貼り付けて 下記のベリサインセキュアドシールを JavaScriptで組み込んだところ Markup Validation Serviceでエラーが出て しまうようになりました。 <script src=https://seal.verisign.com/getseal?host_name=www.xxxx.ne.jp&size=M&use_flash=YES&use_transparent=YES&lang=ja></script> ベリサインセキュアドシールのurlに書かれている パラメータが原因のようなのですが これをエラーが出ないようにXHTMLで最適化するためには どのようにしたら良いでしょうか? どなたかご教授頂けると幸いです。 よろしくお願い致します。

    • ベストアンサー
    • HTML
  • XHTML1.0 STRICTで動かすにはどうすれば?

    http://web-graphics.com/mtarchive/001717.php 上記のサイトのソースなんですが、4.01ではうまく動いてくれたのですが、 XHTML1.0 strictでは、動きません。エラー表示はないのですが、原因がわかりません。教えてください、お願いします。

  • JavaScriptが実装できない

    初めまして。 Google Maps APIを使ってwebページ上でgoogle mapsを表示させようと思い htmlファイルとjavascriptファイルを実装したのですがうまく動きません。 ソースコードは以下の通りです。 googlemaps.html <!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <style type="text/css"> html, body { height: 100%; } </style> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"> </script> <script type="text/javascript" src="http://www.google.com/jsapi"></script> <script type="text/javascript"> google.load("jquery", "1.5.0"); </script> <script type="text/javascript" src="googlemaps.js"></script> <title>指定した位置を中心とする地図</title> </head> <body> <p> 緯度<input id="lat" type="text" value="35.632997" /> 経度<input id="lng" type="text" value="139.648609" /> <button id="button">地図を作る</button> </p> <div id="map_canvas" style="width: 100%; height: 90%;"></div> </body> </html> googlemaps.js $(document).ready(function() { $("#button").click(function() { // input要素の値を取得し、マップの中心を決める var lat = $("#lat").val(); var lng = $("#lng").val(); var myCenter = new google.maps.LatLng(lat, lng); // 地図のオプション var myOptions = { zoom : 14, center : myCenter, mapTypeId : google.maps.MapTypeId.ROADMAP // 必須 }; // 地図の生成 var myMap = new google.maps.Map(document.getElementById("map_canvas"), myOptions); // マーカーの生成 new google.maps.Marker( { position : myCenter, map : myMap, title : "Hello World!" }); }); }); firebugはgooglemaps.js 404 not foundといっているのでhtmlとjavascriptの連携が うまくいってないのだと思うのですが、どうすればいいのかわからず前にすすめません。 お詳しい方、ご教授ください。

  • moment.js

    moment.js moment.jsで秒の部分(17:00:「00」)を削るにはどうしたら良いでしょうか? 以下ソースです。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>サンプル</title> </head> <body> <script src="http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.2/moment.min.js"></script> <script type="text/javascript" src="jquery-1.7.2.min.js"></script> <script type="text/javascript" src="moment.js"></script> <script src="fastclick.js"></script> <script> var now = moment(); console.log(now.toDate()); // Dateオブジェクトが返される // 文字列からも生成できるし var shougatsu = moment('2015-01-01'); console.log(shougatsu.toString()); // "Thu Jan 01 2015 00:00:00 GMT+0900" // もちろんDateオブジェクトからも生成できる var kodomonohi = moment(new Date('2015-05-05')); console.log(kodomonohi.toString()); // "Tue May 05 2015 09:00:00 GMT+0900" </script> </body> </html> コンソールログで表示をしているのですが何時何分何秒の「秒」の部分を非表示にしたい場合どうしたら良いでしょうか?

  • galleryviewのjavascriptについ

    下記の画像の部分にどうしてもリンクを貼りたいのですが上手くいきません。ご教授願います。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>GalleryView - Default Demo</title> <!-- First, add jQuery (and jQuery UI if using custom easing or animation --> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script> <!-- Second, add the Timer and Easing plugins --> <script type="text/javascript" src="../js/jquery.timers-1.2.js"></script> <script type="text/javascript" src="../js/jquery.easing.1.3.js"></script> <!-- Third, add the GalleryView Javascript and CSS files --> <script type="text/javascript" src="../js/jquery.galleryview-3.0-dev.js"></script> <link type="text/css" rel="stylesheet" href="../css/jquery.galleryview-3.0-dev.css" /> <!-- Lastly, call the galleryView() function on your unordered list(s) --> <script type="text/javascript"> $(function(){ $('#myGallery').galleryView(); }); </script> </head> <body> <ul id="myGallery"> <li><a href="http://ariacompany-since2010.com/shop/products/list.php?category_id=47"><img src="http://www.spaceforaname.com/galleryview/img/photos/bp1.jpg" alt="Lone Tree Yellowstone" /></a> <li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp2.jpg" alt="Is He Still There?!" /> <li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp4.jpg" alt="Noni Nectar For Green Gecko" /> <li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp7.jpg" alt="Flight of an Eagle Owl" /> <li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp14.jpg" alt="Winter Lollipops" /> <li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp26.jpg" alt="Day of Youth" /> <li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp27.jpg" alt="Sunbathing Underwater" /> <li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp28.jpg" alt="Untitled" /> <li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp41.jpg" alt="New Orleans Streetcar" /> <li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp49.jpg" alt="By The Wind of Chance" /> <li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp52.jpg" alt="Fishing on the Cloud" /> <li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp53.jpg" alt="Blue Lagoon" /> <li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp54.jpg" alt="Time" /> </ul> <p>Please view the source of this page if you are having difficulties setting up GalleryView.</p> </body> </html>

  • javascriptソースの秘匿

    あるアプリのアプリIDを javascriptに書いた場合、ソース上にオンコーディングする形になるのですが、 そのソースをchrom等のデバッカー(F12)で表示をさせたくないのですが、 いい方法はありますでしょうか。 例 <html>  <head>   <title>TEST</title>   <script type="text/javascript" src="js/test.js">  </head> 上記html上からtest.jsを呼出 test.jsないで別のjsを呼び出したいと思ってます。 ※別のjsは単純に変数を設定したもの var key = xxxxxx; test.jsはデバッカーで見れてもいいのですが、別のjs(仮にtest2.js)は 見せない方法をご教授願えないでしょうか。

  • 【javascript】2つ同時に上手く動かない

    javascript初心者です。 現在作成している画面に2つのjavascriptを動かしたいと思っております。 しかしながら、一つずつでは動くのですが、同時に表示すると上手く動作しません。 いい方法などありましたらご教授お願い致します。 【htmlのヘッド】 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript" src="js/jquery.coda-slider-2.0.js" charset="utf-8"></script> <script type="text/javascript" src="js/jquery.easing.1.3.js"></script> <script type="text/javascript" src="js/sm_scroll.js"></script> <script type="text/javascript" src="js/jcaption.min.js"></script> <script type="text/javascript" charset="utf-8"> $(function(){ $('#coda-slider-1').codaSlider({ autoSlide:false, autoHeight:false, autoSlideStopWhenClicked:false, autoSlideInterval:10000, firstPanelToLoad:1, dynamicArrows: false, }); }); </script> <script type="text/javascript" src="js/prototype.js"></script> <script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script> <script type="text/javascript" src="js/lightbox.js"></script> 【上部のjavascript】 Coda-Slider 参照URL:http://phpjavascriptroom.com/exp3.php?f=include/ajax/jquery_plugin_slider/coda_slider.inc&ttl=%E8%A8%AD%E7%BD%AE%E3%82%B5%E3%83%B3%E3%83%97%E3%83%AB 【下部のjavascript】 litebox 参照URL:http://lokeshdhakar.com/projects/lightbox2/ javascript内が初期化されているのが問題なのでしょうか? 解決の方法などありませんでしょうか? 以上、宜しくお願い致します。

  • js 引用符

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>サンプル</title> </head> <body> <div id="a"></div> <script src="http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.2/moment.min.js"></script> <script type="text/javascript" src="jquery-1.7.2.min.js"></script> <script type="text/javascript" src="moment.js"></script> <script src="fastclick.js"></script> <script> $(function(){ var retinaSwitch = window.<span class="searchword">devicePixelRatio</span>; if(retinaSwitch == 1) { $('#container').html('Retinaディスプレイではありません'); } else if(retinaSwitch == 2) { $('#container').html('Retinaディスプレイです'); } }); </script> </body> </html> javascriptのコードなのですがWebサイトからコピペした文章が上手く反映されません。引用符関係のイージーミスだとは思うのですが、ちょっとドツボに嵌っているので、ご指摘頂ければと思います。

専門家に質問してみよう