Javascript基礎入門学習ノートを整理_JavaScriptスキル

変数とは何か理解していますか?
変数は情報を保存するために使用されるコンテナです
変数宣言
構文:

var 変数名
変数名 = 値;
変数は最初に宣言してから割り当てる必要があります
変数は繰り返し割り当て可能
変数の命名規則

• 変数は文字で始まる必要があります。
• 変数は $ および _ 記号で始めることもできます (ただし、これはお勧めしません)。
変数名では大文字と小文字が区別されます (a と A は異なる変数です)。

1. ステートメント ステートメントはセミコロンで終わります。セミコロンが省略された場合、パーサーがステートメントの終わりを判断します。
良いコーディング習慣は ;
で終わる必要があります。

2. データ型 JavaScript では、情報の一部が値です。値にはさまざまなタイプがありますが、最もよく知られているタイプは数値です。文字列値は、引用符で囲まれた 1 つ以上の単語です。

数値 任意の数値。数値には小数点があってもなくても構いません 68.57
文字列 引用符で囲まれた文字。一重引用符または二重引用符「hello, world」を使用できます
ブール true または false true
未定義および Null この値「未定義」は、変数に値が含まれていないことを意味します。変数の値を null に設定すると、変数をクリアできます。
オブジェクト オブジェクト に関連付けられた任意の値
関数 関数 によって返される値

var a; //a为undefined
var a = 6; //a 为数字
var a = "Jason"; // a 为字符串

3. 関数とは何ですか? 関数は、特定のタスクを実行する一連の JavaScript ステートメントです
基本的な構文:

function 函数名(){
 函数代码;
}

関数名(); 説明:

function は関数キーワードを定義します。
「関数名」は関数に付けた名前です。 「機能コード」は、特定の機能を実現するコードに置き換えられます。
「第二関数名」は関数呼び出しの種類です

 function add2(){
 var sun = 3 + 2;
 alert(sun);
 }
 add2();//调用函数直接写函数名直接弹出函数代码
 <input type="button" value="点击我" onclick="add2()" />
 <!-- 单击按钮后，调用函数，onclick为点击事件 -->

4. 出力内容 (document.write)
document.write() は、Web ページのコンテンツを直接出力します。
1つ目の方法: 出力内容を""で囲み、""記号内の内容をそのまま出力します。

document.write("I love JavaScript!");

2 番目のタイプ: 変数を介してコンテンツを出力

var mystr = "hello world";
document.write(mysrt);//直接写变量名，输出变量存储的内容

3 番目のタイプ: 複数のコンテンツを出力し、シンボルを使用してコンテンツを接続します。

var mystr = "hello";
document.write(mystr + "I love Java Script");//多项内容之间用+号连接

4 番目の方法: HTML タグを出力し、タグを "" で囲みます。

var mystr="hello";
document.write(mystr+"<br>");//输出hello后，输出一个换行符
document.write("JavaScript");

5. 警告 (警告メッセージダイアログボックス)
Web サイトにアクセスすると、小さなウィンドウが突然ポップアップし、プロンプト メッセージが書かれることがあります。 「OK」をクリックしないと、Web ページ上で何も操作できません。この小さなウィンドウはアラートを使用して実装されています。 構文:
アラート (文字列または変数)

var mynum = 30;
alert("hello!");
alert(mynum);

結果: メッセージ ボックスを順番にポップアップします (警告ポップアップ メッセージ ダイアログ ボックスには [OK] ボタンが含まれます)

注: 1. ダイアログボックスの「OK」ボタンをクリックするまで、他の操作は実行できません。
2. メッセージ ダイアログ ボックスは、プログラムのデバッグによく使用されます。
3. アラート出力コンテンツ。document.write
と同様の文字列または変数にすることができます。

6. 選択内容の確認(メッセージ確認ダイアログ)
ユーザーへの情報提供に加え、ユーザーからの情報取得も期待しています。ここではメッセージ確認ダイアログボックスを使用します。 確認メッセージ ダイアログ ボックスは通常、ユーザーが「正しいですか?」などの選択を行うために使用されます。ダイアログ ボックス ([OK] ボタンと [キャンセル] ボタンを含む) を表示します。
構文:confirm(str);
パラメータの説明: str: メッセージ ダイアログ ボックスに表示されるテキスト 戻り値: ブール値
戻り値:
ユーザーが「OK」ボタンをクリックすると true を返します
ユーザーが「キャンセル」ボタンをクリックすると false を返します
注: 戻り値は、ユーザーがどのボタンをクリックしたかを判断するために使用できます

<script type="text/javascript">
 var mymessage=confirm("你喜欢JavaScript吗&#63;");
 if(mymessage==true){
   document.write("很好,加油!"); 
  }else{
   document.write("JS功能强大，要学习噢!");
  }
 </script>

7、提问（prompt 消息对话框）
有时候，不仅希望用户回答Yes/No。而是希望得到更特定的响应。这中情况我们可以利用prompt。
prompt弹出消息对话框,通常用于询问一些需要与用户交互的信息。弹出消息对话框（包含一个确定按钮、取消按钮与一个文本输入框）。
语法：

prompt(str1,str2);
参数说明：
str1:要显示在消息对话框中的文本，不可修改
str2:文本框中的内容，可以修改
返回值：
1、点击确定按钮，文本框中的内容将作为函数返回值
2、点击取消按钮，将返回null
 

 function rec(){
  var score; //score变量，用来存储用户输入的成绩值。
  score = prompt("请输入你的成绩","90");
  if(score>=90){
   document.write("你很棒!");
  }else if(score>=75){
   document.write("不错吆!");
  }else if(score>=60){
   document.write("要加油!");
  }else{
   document.write("要努力了!");
  };
 } ; 

 <script>
  var myName = prompt("输入您的名字");
   if(myName != null && myName != ""){
    document.write("welcom to" + myName);
   }else{
    document.write("welcom to my friend");
   }
</script>

8、打开新窗口（window.open）
语法：

window.open([URL], [窗口名称], [参数字符串])
参数说明:
URL：可选参数，在窗口中要显示网页的网址或路径。如果省略这个参数，或者它的值是空字符串，那么窗口就不显示任何文档。
窗口名称：可选参数，被打开窗口的名称。
1.该名称由字母、数字和下划线字符组成。
2.窗口名称：可选,该字符串是一个由逗号分隔的特征列表，声明了被打开窗口的名称。可以 是"_top"、"_blank"、"_selft"、"_parent"等。
_blank 在新窗口显示目标网页
_selft 在当前窗口显示目标网页
_parent 框架网页中当前整个窗口位置显示目标网页
_top 框架网页中在上部窗口中显示目标网页
3.相同 name 的窗口只能创建一个，要想创建多个窗口则 name 不能相同。
4.name 不能包含有空格。
参数字符串：可选参数，设置窗口参数，各参数用逗号隔开。

参数表：
top　　　　Number　　窗口顶部离开屏幕顶部的像素数
left　　　　Number　　窗口左端离开屏幕左端的像素数
width　　　　Number　　窗口的宽度
height　　　　Number　　窗口的高度
menubar　　　　yes,no　　窗口有没有菜单
toolbar　　　　yes,no　　窗口有没有工具条
scrollbars　　　　yes,no　　 窗口有没有滚动条
status　　　　　　yes,no　　 窗口有没有状态栏

 <script type="text/javascript">
  window.open('http://','_blank','width=300,height=200,menubar=no,toolbar=no, status=no,scrollbars=yes')
 </script>

9、关闭窗口（window.close）
close()关闭窗口
用法：

window.close();//关闭本窗口
 <窗口对象>.close();//关闭指定的窗口

例如:关闭新建的窗口。

 <script type="text/javascript">
  var mywin=window.open('http://www.imooc.com'); //将新打的窗口对象，存储在变量mywin中
  mywin.close();
 </script>

10、innerHTML属性
innerHTML属性用于获取或替换HTML元素的内容。
语法：

Object.innerHTML
Object是获取的元素对象，如通过document.getElementById("ID")获取元素。

 

<h2 id="con">javascript</H2>
 <script type="text/javascript">
 　　var mychar=document.getElementById("con");
 　　document.write("原标题:"+mychar.innerHTML+"<br>"); //输出原h2标签内容
 　　mychar.innerHTML="hello world"
 　　document.write("修改后的标题:"+mychar.innerHTML); //输出修改后h2标签内容
 </script>

11、改变HTML样式
语法：

Object.style.property=new style;
注意：Object是获取的元素对象，如通过document.getElementById("id")获取的元素

<h2 id="con">I love JavaScript</h2>
 <script type="text/javascript">
 var mychar= document.getElementById("con");
 mychar.style.color="red";
 mychar.style.background="#ccc";
 mychar.style.width="300px";
 </script>

12、显示和隐藏（display属性）
语法：

Object.style.display = value
value值：
none 此元素不会被显示（及隐藏）
block 此元素将显示为块级元素（即显示）

mychar.style.display = "block"

13、控制类名（className属性）
className属性设置或返回元素的class属性。
语法：

object.className = classname
作用：
1、获取元素的class属性
2、为网页内的某个元素指定一个css样式来更改该元素的外观

p2.className = "two";
以上就是整理的javascript的基础知识学习笔记，希望对大家的学习有所帮助。