2016-07-23 1 views
-2

警告ボックスに表示される代わりにWebページにコードを表示する方法を知りたいのですが、どうすればいいですか?私はIDのectが必要であることを理解していますが、私はどこから始めたらいいのか分かりません。どんな助けも良いでしょう。ありがとうございました!Javaスクリプトをhtmlに統合するにはどうすればよいですか?

<!DOCTYPE html> 
 
<html> 
 

 
<script> 
 

 

 

 
//Set of variables 
 
var nameCheck = /^[a-zA-Z\s]+$/; 
 
//eliminates anything not relevant 
 
var numberCheck = /^[0-9\.]+$/; 
 
//eliminates anything not relevant 
 
var totHours = 0; 
 
//adds total gaming hours on one day 
 
var dayHours = 0; 
 
//how many on one such day set in i from 1-7 
 
var averHours = 0; 
 
//stores the average by dividing by the tothours by 7 
 
var mostPerDay = 0; 
 
//calculates day with most gamed 
 
var mostOnDay = 0; 
 
//Most hours on ONE day 
 
var moreDays = " "; 
 
//adds an s to the end of days if more than one 
 
var mpd = 0; 
 
//most per day 
 
var ah = 0; 
 
//average hours 
 
var th = 0; 
 
//total hours 
 
var name = prompt("What is your name?"); 
 
//asks users name 
 

 

 
//Make sure user inputs a name that includes letters and or spaces 
 
while (name == "null" || isNaN(name) == false || !name.match(nameCheck)){ 
 
\t alert("Invalid Name!"); 
 
\t name = prompt("What is your name?"); 
 
} 
 

 
//Greets the user by name 
 
alert("Hello " + name); 
 

 
//Ask how many hours gamed on a day 
 
for (var i = 1; i <= 7; i++){ 
 
\t dayHours = prompt("How many hours have you gamed on day " + i + "?") 
 

 
//Reask the question if the user inputs an invald answer 
 
\t while (dayHours == null || isNaN(dayHours) || dayHours > 24 || !dayHours.match(numberCheck) || dayHours < 0){ 
 
\t \t alert("Incorrect! No letters or symbols, and make sure your input is under 24"); 
 
\t \t dayHours = prompt("How many hours have you gamed on day " + i + "?") 
 
\t } 
 

 
//Adds to total hours 
 
totHours += Number(dayHours) 
 
//Calculates days with most hours gamed 
 
if (mostPerDay > dayHours){ 
 
} 
 
else if (mostPerDay < dayHours){ 
 
\t mostPerDay = Number(dayHours); 
 
\t mostOnDay = i; 
 
} 
 
else if (mostPerDay = dayHours){ 
 
\t mostOnDay += " and " + i; 
 
\t mostPerDay = Number(dayHours); 
 
} 
 

 
} 
 
//Adds 's' to the statistics if more than one day 
 
if (isNaN(mostOnDay) == true){ 
 
\t moreDays = "s "; 
 
} 
 
//Divides the total hours by 7 to get average over those 7 days 
 
aver = (totHours/7); 
 
//Calculates and rounds to the value of 1 
 
th = totHours.toFixed(1); 
 
ah = aver.toFixed(2); 
 
mpd = mostPerDay.toFixed(1); 
 

 
//States calculated statistics 
 
alert("\nTotal gaming hours this week " + th + "\nAverage gaming hours this week " + ah + "\nMost on one day" + moreDays + mostOnDay + " for " + mpd + " hours."); 
 

 
//Comments on average hours per day gamed 
 

 
if (averHours <= 2){ 
 
alert("Healthy amount of gaming this week") 
 
} 
 
else if (averHours <= 24){ 
 
\t alert("Unhealthy amount of gaming this week") 
 
} 
 

 

 

 
</script> 
 

 

 
</html>

答えて

0

は、HTML文書にJavaScriptを含めるには、いくつかの方法があります。

  • を置きますJavaScriptコードを別のfilename.jsドキュメントに置き、HTMLドキュメントのヘッダーで参照してください(th (<head></head>との間)である。<script type="text/javascript" src="filename.js"></script>。これは、機能(JavaScript)と構造(HTML)を分離するため、「最もクリーンな」オプションです。

  • HTMLコードのヘッダーに直接JavaScriptコードを挿入します。あなたが動的にdocument.write('');

でテキストを追加したいときには、たとえば、再び<script></script>の間で、(何srcここでは属性)<script type="text/javascript">間と</script> HTMLドキュメントのボディに

  • 、ではありません<div id="mydiv">内のテキストを変更することはそのid経由でアクセスすることによって行うことができます。

    document.getElementById('mydiv').innerText = 'text'; 
    

    または変種innerHTML,outerTextまたはouterHTMLを介して、

    簡単なDOM操作のために、jQueryを調べることができます。また、ヘッダーまたは外部ファイルのJavaScriptコードはすぐに実行されるため、ドキュメント本体の特定の部分がまだロードされていないとエラーが発生する可能性があります。 jQueryは、コードをラップすることで洗練されたソリューションを提供します

    $(document).ready(function() { 
        // code here 
    }); 
    

    幸運を祈る!

  • 0

    外部へのリンクが含まれるようになり、これを行うための簡単な方法ジャバスクリプトファイル:HTMLファイルの一番下に

    <script src="path/myfile.js"></script> 
    

    。スクリプトにjQueryが必要な場合は、スクリプトの前に外部スクリプトとしてリンクされていることを確認してください。 htmlタグにIDまたはクラスを付けることで、javascriptファイル内のhtml要素を参照できます。例:HTMLで

    <div id = "mydiv"> </div> 
    

    JSでの選択要素:

    $('#mydiv') 
    
    0

    あなたのウェブページをよりリアクティブにしようとしている場合は、jqueryを調べることができます。これは、あなたのウェブページをよりインタラクティブにするのに役立つ、軽量のjavascriptライブラリです。以下のチュートリアルチェックアウト:

    http://www.w3schools.com/jquery/

    は、私は完全にあなたの質問を理解していないが、JavaScriptは文字通りあなたのウェブページに表示されます場合は念のためにあなたが求めているが、それはあなたが表示されませんしない限り、テキストとして。 javascriptコードをデバッグする場合は、Chromeや他のブラウザの開発ツールを使用できます。

    https://developer.chrome.com/devtools

    関連する問題