Heim > Web-Frontend > js-Tutorial > Hauptteil

Organisieren Sie grundlegende Javascript-Einführungsstudiennotizen_Javascript-Kenntnisse

WBOY
Freigeben: 2016-05-16 15:29:12
Original
1715 Leute haben es durchsucht

Verstehen Sie, was eine Variable ist?
Variablen sind Container zum Speichern von Informationen
Variablendeklaration
Syntax:

Var-Variablenname
Variablenname = Wert;
Variablen müssen zuerst deklariert und dann
zugewiesen werden Variablen können wiederholt zugewiesen werden
Benennungsregeln für Variablen

  • Variablen müssen mit einem Buchstaben beginnen;
  • Variablen können auch mit den Symbolen $ und _ beginnen (wir empfehlen dies jedoch nicht);
  • Variablennamen unterscheiden zwischen Groß- und Kleinschreibung (a und A sind unterschiedliche Variablen).

1. Erklärung Die Anweisung endet mit einem Semikolon. Wenn das Semikolon weggelassen wird, bestimmt der Parser das Ende der Anweisung.
Gute Programmiergewohnheiten sollten mit ;
enden

2. Datentyp In JavaScript ist eine Information ein Wert. Werte gibt es in verschiedenen Typen, wobei Zahlen der bekannteste Typ sind. Ein Zeichenfolgenwert besteht aus einem oder mehreren Wörtern, die in Anführungszeichen eingeschlossen sind.

Zahl Beliebiger numerischer Wert. Die Zahl kann mit oder ohne Dezimalpunkt 68,57 sein
String Zeichen in Anführungszeichen. Sie können einfache oder doppelte Anführungszeichen „hello, world“ verwenden
Boolean wahr oder falsch wahr
Undefiniert und Null Dieser Wert Undefiniert bedeutet, dass die Variable keinen Wert enthält. Eine Variable kann gelöscht werden, indem ihr Wert auf Null gesetzt wird. 
Objekt Jeder mit dem Objekt verknüpfte Wert
Funktion Von der Funktion zurückgegebener Wert

var a; //a为undefined
var a = 6; //a 为数字
var a = "Jason"; // a 为字符串
Nach dem Login kopieren

3. Was ist eine Funktion? Eine Funktion ist eine Reihe von JavaScript-Anweisungen, die eine bestimmte Aufgabe ausführen
Grundlegende Syntax:

function 函数名(){
 函数代码;
}
Nach dem Login kopieren

Funktionsname(); Beschreibung:

function definiert das Funktionsschlüsselwort.
„Funktionsname“ ist der Name, den Sie der Funktion gegeben haben.
„Funktionscode“ wird durch Code ersetzt, der eine bestimmte Funktion ausführt.
„Zweiter Funktionsname“ ist eine Art Funktionsaufruf

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

4. Inhalt ausgeben (document.write)
document.write() gibt den Inhalt direkt auf der Webseite aus.

Erste Methode: Der Ausgabeinhalt wird in „“ eingeschlossen und der Inhalt innerhalb des „“-Zeichens wird direkt ausgegeben.

document.write("I love JavaScript!");
Nach dem Login kopieren

Zweiter Typ: Inhalte über Variablen ausgeben

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

Der dritte Typ: Mehrere Inhalte ausgeben und Symbole verwenden, um die Inhalte zu verbinden.

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

Die vierte Methode: HTML-Tags ausgeben und bearbeiten. Die Tags sind in „“ eingeschlossen.

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

5. Warnung (Dialogfeld mit Warnmeldung)
Wenn wir die Website besuchen, erscheint manchmal plötzlich ein kleines Fenster mit einer Aufforderungsmeldung darauf. Wenn Sie nicht auf „OK“ klicken, können Sie auf der Webseite keine Vorgänge ausführen. Dieses kleine Fenster wird mithilfe einer Warnung implementiert.
Syntax:
alert (Zeichenfolge oder Variable);

var mynum = 30;
alert("hello!");
alert(mynum);
Nach dem Login kopieren
Ergebnis: Popup-Meldungsfelder nacheinander (das Dialogfeld mit der Popup-Meldung enthält eine Schaltfläche „OK“)


Hinweis: 1. Es können keine weiteren Vorgänge ausgeführt werden, bevor im Dialogfeld auf die Schaltfläche „OK“ geklickt wird.
2. Meldungsdialogfelder können häufig zum Debuggen von Programmen verwendet werden.
3. Alert-Ausgabeinhalt, der eine Zeichenfolge oder eine Variable sein kann, ähnlich wie document.write

6. Auswahl bestätigen (Dialogfeld „Nachricht bestätigen“)
Neben der Bereitstellung von Informationen für Benutzer hoffen wir auch, Informationen von Benutzern zu erhalten. Hier wird das Dialogfeld „Nachricht bestätigen“ verwendet.
Das Bestätigungsdialogfeld wird normalerweise verwendet, um dem Benutzer die Möglichkeit zu geben, eine Auswahl zu treffen, z. B. „Haben Sie Recht?“ usw. Öffnet ein Dialogfeld (einschließlich einer Schaltfläche „OK“ und einer Schaltfläche „Abbrechen“).
Syntax: bestätigen(str);
Parameterbeschreibung: str: Text, der im Meldungsdialogfeld angezeigt werden soll. Rückgabewert: Boolescher Wert
Rückgabewert:
Wenn der Benutzer auf die Schaltfläche „OK“ klickt, wird true
zurückgegeben Wenn der Benutzer auf die Schaltfläche „Abbrechen“ klickt, wird „false“ zurückgegeben
Hinweis: Der Rückgabewert kann verwendet werden, um festzustellen, auf welche Schaltfläche der Benutzer geklickt hat

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

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>

Nach dem Login kopieren

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>
Nach dem Login kopieren

9、关闭窗口(window.close)
close()关闭窗口
用法:

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

例如:关闭新建的窗口。

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

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>
Nach dem Login kopieren

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>
Nach dem Login kopieren

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的基础知识学习笔记,希望对大家的学习有所帮助。

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage