JavaScript_第一天

来源:互联网 发布:mui项目实例源码 编辑:程序博客网 时间:2024/06/06 06:44

JavaScript是一种具有面向对象能力的、解释型的程序设计语言。

Example_01:Factorials

<html><head><title>Factorials</title></head><body><h2>Table of Factorials</h2><script type="text/javascript">var fact = 1;for (var i = 1; i <= 10; ++i){fact = fact * i;document.write(i + "!= " + fact + "<br />");}</script></body></html>



document.write():当HTML文档载入到浏览器的时候,用来动态地把HTML文本输出到一个HTML文档。

Example_02:一个定义了JavaScript事件句柄的HTML按钮

<button onclick = "alert('You clicked the button');">Click here</button>


点击执行效果:


使用的onclick属性包含了一串JavaScript代码,当用户点击该按钮的时候,就会执行这段代码。在这个例子中,onclick事件句柄调用alert()函数,该函数会弹出一个对话框以显示指定的消息。

Example_03:用JavaScript计算借贷支付(在IE浏览器上不能运行)

<html><head><title>JavaScript Loan Calculator</title><style>/* This is a CSS style sheet:it adds style to the program output */.result {/* For elements with class="result" */font-weight:bold;}#payment {/* For element with id="payment" */text-decoration:underline;}</style></head><body><!--This is an HTML form that allows the user to enter data and allowsJavaScript to display the results it computes back to the user.Theform elements are embedded in a table to improve their appearance.The form itself is given the name "loandata",and the field withinthe form are given names such as "interest" and "years".Thesefield names are used in the JavaScript code that follows the form.Note that some of the form elements define "onchange" or "onclick"event handlers.These specify strings of JavaScript code to beexecuted when the user enters data or clicks on a button.--><form name="loandata"><table><tr><td><b>Enter Loan Information:</b></td></tr><tr><td>1)Amount of the loan (any currency):</td><td><input type="text" name="principal" onchange="calculate();"></td></tr><tr><td>2)Annual percentage rate of interest:</td><td><input type="text" name="interest" onchange="calculate();"></td></tr><tr><td>3)Repayment period in years:</td><td><input type="text" name="years" onchange="calculate();"></td></tr><tr><td></td><td><input type="button" value="Compute" onclick="calculate();"></td></tr><tr><td><b>Payment Information:</b></td></tr><tr><td>4)Your monthly payment:</td><td>$<span class="result" id="payment"></span></td></tr><tr><td>5)Your total payment:</td><td>$<span class="result" id="total"></span></td></tr><tr><td>6)Your total interest payments:</td><td>$<span class="result" id="totalinterest"></span></td></tr></table></form><script language="JavaScript">/* * This is the JavaScript function that makes the example work.Note that * this script defines the calculate() function called by the event * handlers in the form.The function reads values from the form * <input> fields using the names defined in the previous HTML code.It outputs * its results into the named <span> elements. */function calculate() {// Get he user's input from the form.Assume it is all valid.// Convert interest from a percentage to a decimal, and convert from// an annual rate to a monthly rate.Convert payment period in years// to the number of monthly payments.var principal = document.loandata.principal.value;var interest = document.loandata.interest.value / 100 / 12;var payments = document.loandata.years.value * 12;// Now compute the monthly payment figure, using esoteric math.var x = Math.pow(1 + interest, payments);var monthly = (principal * x * interest) / (x - 1);// Get named <span> elements from the form.var payment = document.getElementById("payment");var total = document.getElementById("total");var totalinterest = document = document.getElementById("totalinterest");// Check that the result is a finite number.If so,display the// result bu setting the HTML content of each <span> element.if (isFinite(monthly)) { payment.innerHTML = monthly.toFixed(2);total.innerHTML = (monthly * payments).toFixed(2);totalinterest.innerHTML = ((monthly * payments) - principal).toFixed(2);}// Otherwise,the user's inpt was probably invalid, so display nothing.else {payment.innerHTML = "";total.innerHTML = "";totalinterest.innerHTML = "";}}</script></body></html>

在浏览器URL输入的格式为:javascript:URL伪协议来计算JavaScript表达式并返回计算的结果。一个JavaScript URL是由javascript:协议说明符加上任意的JavaScript代码(语句之间用分号隔开)构成的。当浏览器装载了这样的URL时,它将执行其中的JavaScript代码。这样的URL中的最后一个表达式的值将被转换成字符串,该字符串会被作为新文档显示在Web浏览器中。

Example_04:在浏览器URL输入:

Javascript:i=1;alert(i);

将会弹出一个对话框显示i的值为1。


JavaScript程序是用Unicode字符集编写的。

JavaScript是一种区分大小写的语言。但是要注意,HTML并不区分大小写(尽管XHTML是区分大小写的)。

JavaScript会忽略程序中记号之间的空格、制表符和换行符。

JavaScript每条语句必须写分号,这样比较规范,不容易出错。比如:

return

true;

等价于

return;

true;

和Java一样,JavaScript也支持C++型的注释和C型注释。JavaScript会把处于”//”和一行结尾之间的任何文本都当作注释忽略掉。此外”/*”和”*/”之间的文本也会被当作注释,这些C型的注释可以跨越多行,但是其中不能有嵌套的注释。下面代码都是合法的JavaScript注释:

//This is a single-line comment./*This is also a comment */ // and here is another comment./**This is yet another comment.*It has multiple lines.*/

命名规则:第一个字符必须是字母、下划线(_)或美元符号($),接下来的字符可以是字母、数字、下划线或美元符号(数字不允许作为首字符出现,这样JavaScript可以轻易的区别开标识符和数字了)。

这次就讲到这里了,最后附加一个小例子:

<script>document.write("<h2>Table of Fibonacci Numbers</h2>");for (i = 0, j = 1, k = 0, fib = 0; i < 50; ++i, fib = j + k, j = k, k = fib) {document.write("Fibonacci (" + i + ") = " + fib);/*Equals:alert("Fibonacci (" + i + ") = " + fib");This will pop a windows.*/document.write("<br />");}</script>


休息一下

不要为了取悦别人而改变。改变,只为让自己变得更好,拥有更美好的未来。

0 0