javascript編程規則
彈窗(舉例)
?alert("內容"),直接寫在控制區生效
三種寫法
?1、行內js語法 :需要注意引號的問題
? ? <input type="button" value="提示窗" οnclick=' alert("消息") '>
? ? (onclick : 為標簽綁定一個 數據的左鍵點擊功能,οnclick=" 寫js代碼 ")
? ??
2、內聯js語法?
? ? <input type="button" value="提示窗" οnclick=" show() ">
? ? <input type="button" value="提示窗2" οnclick=" 消息() ">
(show、消息為類似id的名字,必須唯一,重復則覆蓋)
??
function show(){
? ? ? ? ? ? alert("消息")
? ? ? ? }
?// 后續代碼覆蓋前面的代碼
?function show(){
? ? ?alert("昨天")
?}
3、外聯js語法
? ? <input type="button" ?value="提示窗" ?οnclick="showTip()">
然后通過<script src="./文件路徑.js"></script>聯系js文件
js注釋方法
// 單行注釋
?/*
? ? 多行注釋
*/
/**
? ? 文檔注釋
*/
js結果輸出
<script>
function outMsg1(){// 控制臺輸出// ? ?==> 程序員的開發過程中的調試// ? ?==> 頁面彩蛋console.log("控制臺輸出1"); // 日志輸出console.error("控制臺輸出2"); // 錯誤輸出console.warn("控制臺輸出3"); // 警告輸出console.info("控制臺輸出4"); // 提示}function outMsg2(){// 頁面輸出// ?第一次調用時,將整個頁面進行替換,連續多次的輸出都會保留// ?不換行document.write("頁面輸出1");document.write("頁面輸出2");document.write("頁面輸出3");// 換行輸出,以html不識別的換行方式進行輸出(顯示為空格)document.writeln("頁面輸出4");document.writeln("頁面輸出5");document.writeln("頁面輸出6");// 通過定義標簽的方式,向頁面寫入結果,瀏覽器一樣會解析標簽document.write("頁面輸出7<br>");document.write("頁面輸出8<br>");document.write("頁面輸出9<br>");document.write("頁面輸出10<br>");}function outMsg3(){// 信息提示彈出(從上到下依次顯示,如果不操作則顯示第一個)alert("彈窗輸出1");// alert("彈窗輸出2");// alert("彈窗輸出3");// alert("彈窗輸出4");// alert("彈窗輸出5");// 確認彈窗confirm("彈出輸出6") ? (有確認和取消按鈕)// 輸入彈窗prompt("輸入彈窗") ? ? ?(多一個輸入框)}</script><body><input type="button" value="控制臺輸出" onclick=" outMsg1() "><hr><input type="button" value="頁面輸出" onclick=" outMsg2() "><hr><input type="button" value="彈窗輸出" onclick=" outMsg3() "></body>
js變量定義和使用
<script>// 變量:可變的數據存儲區域// 1. 變量聲明// function var 標識符// var 用于定義變量// 語法 ?var 變量名;// 定義了一個名字叫做arg的變量var arg;// 變量賦值arg = "數據";function printArg(){// 調用變量alert( arg )}function setArg(){// 變量的賦值arg = "新數據";}// 聲明(定義)變量時可以直接賦值var msg = "msg數據";// 一次性聲明多個變量,并進行賦值var a="a值" , b="b值" , c="值";// JS 雖然變量名是根據需要自行定義的,需要遵守規則規范// ? ? *語法規范: 變量名只能用以 數字 字母 _ $ 組成,不能以數字開頭 ==> 報錯,程序不能運行// ? ? *約定規范: 變量使用英文單詞的名詞,名稱要有含義 ==> 為了讓代碼閱讀更加流程// var +name = "張三"; //非法var name12 = "李四"; // 合法// var 33name = "王五"; // 非法var age = "數據1";var age = "數據2";// 區分大小寫var Age = "數據3";function printAge(){console.log(age);}// var var = "數據"; // 變量名不能使用標識符// 變量名由多個單詞組成時,需要從第二個單詞開始首字母大寫 => 駝峰命名規則var homeTel = "18913000000";</script><body><input type="button" value="輸出變量arg的值" onclick="printArg()"><br><input type="button" value="對變量arg重新賦值" onclick="setArg()"><br><input type="button" value="輸出age" onclick="printAge()">
</body>
// 自動執行,直接寫大括號內內容跳過onclick,頁面刷新自動執行
? ? ? ? var name = "張三";
? ? ? ? console.log( name );
js變量類型
<script>// 變量記錄和存儲數據// ? ? ?數據基于功能不同,類型也不同// ? ? ?不同的類型可以在程序中進行不同的操作// 例子:要求把 ? 張三 ? 和 ? 100 ?求和 , ?無理:求和只能發生在數字和數字之間// 簡單數據類型:String 字符串// ? ? ? ? ? ? Number 數值 => 特殊取值 Infinity NaN// ? ? ? ? ? ? Boolean 布爾真假// ? ? ? ? ? ? undefined 未定義?// ? ? ? ? ? ? null 空var str = "字符串"; // 字符串 - 文本var str1 = '字符串';var str2 = "100"; // 字符串var num = 100; // 數值var num1 = -100;var float = 22.22;// var float2 = abc; // 報錯// 數值類型數據?var num4 = Infinity; // 正無窮var num5 = -Infinity; // 負無窮var num6 = NaN; // 該變量被賦予的數據,不是一個數值數據 => not a number// console.log( 100/2 ); // 除非運算// console.log( "abc"/2 ); // 除非運算// 布爾值 => boolean => 是或不是// ? ? ? 有效值 true (是)//? ? ? ? ? ? ? ? ? ?false (否)var flag = true;?var flag1 = false;?// undefined 值 ==> 表示變量沒有賦值var arg1 = undefined;console.log(arg1);var arg2;console.log(arg2);// null 值 ==> 變量值為 空var arg3 = null;console.log(arg3)</script>
字符串數據的使用
<script>var name = "張三";// console.log( "我是" );// console.log( name );// console.log( "我是name" );console.log( "我是"+name ); // 字符串拼接name = "豆豆";console.log( "我是"+name ); // 字符串拼接// 字符串的運算// ? ? + 關鍵字可以實現多個字符串的拼接var str1 = "-字符串1";var str2 = "-字符串2";console.log( str1 + str2 );var str3 = str1 + str2; // 將str1和str2變量的值進行拼接,賦值給 str3console.log( str3 );//輸出為 -字符串1-字符串2var str4 = "新字符串" + str2;console.log( str4 );輸出為 新字符串-字符串2var msg1 = 'JS學習時知道定義字符串變量使用的語法是: var 變量名 = "字符串值" ';console.log(msg1)// 字符串定義時,必須通過 關鍵字 "" ?或者 '' 包裹,此時最外面的 "" '' 不是內容,是關鍵字// ? ? ?成對的符號,基本都是就近匹配// ? ? ?轉移符 \ 轉移符用于定義或者匹配一些特殊字符var msg2 = " JS學習時知道定義字符串變量使用的語法是: var 變量名 =" \"字符串變量\" ";// ?\" 告訴js 當前的"不是關鍵字console.log(msg2)// 目前,代碼定義字符串不能換行,如果一定要換行,通過 \n 定義換行文字, \n 換行符var msg3 = "aaaa\nbbbb";console.log(msg3);// \t 縮進符 => tab 鍵 => 由多個空格組成 => 空格數量是可以調整var msg4 = "\tabc";console.log(msg4)// var msg5 = "\"";(輸出")var msg5 = "\\";(輸出\)console.log(msg5)var msg6 = "\\\\\\\\\\";console.log(msg6)? (輸出\\\\\)// var name = "張三"// document.write("<h1 style=\"color:red;\">" + name + "</h1>");(輸出紅色大號張三)//等效為document.write("<h1 style=\"color:red;\">張三</h1>");</script>