JAvascriptの紹介とhtmlでjsとjQueryを使用する方法
5307 ワード
jsは世界で最も流行しているプログラミング言語であることは間違いない.これは弱いタイプで、ダイナミックスクリプトプログラミング言語で、HTML、web技術で広く使われています.
くどくど:バックエンドの技術を学んで、今jsが基本的に役に立たないことを発見して、今jspを使ってフロントエンドのページをしないため、至る所jsの静的なページに対するパッケージで、それから前後のインタラクティブを実現します.今jsの機能が本当に強いことを発見して、ページに対して各種の修正ができて、本当に先端のjs技術で十分です.
実は私がjsのページをたくさん見たとき、頭がぼんやりしていて、どのように実行すればいいか全然分かりませんでしたが、彼は他のプログラミング言語と似ていて、関数、変数などがあります.もうくだらないことを言わないでください.
一、jsのHTMLでの使用:
1、jsはhtmlのheadとbodyの内部で定義することができ、ラベルによって導入することができ、scriptラベルによってjsファイルを導入することができ、ラベルの内部に直接jsコード<を書くことができる./span></p>
<p><span></span><span style="font-size:14px;">2、jsはページ定義の位置によって上から下まで識別される.認識の意味は実行ではなく,定義された関数をコンパイルすることである.では、どのように実行しますか?</span></p>
<p><span></span>2.1、最も簡単な方法はHTMLのラベルに直接書くことです:<span> </span></p>
<p><span></span></p>
<pre><code class="language-html"><html> <body οnlοad="func1();func2();func3();"></body> </html></code></pre>
<p><span></span>2.2、Windowsオブジェクトで呼び出す:<span> </span></p>
<p><span></span></p>
<pre><code class="language-javascript"></code></pre>
<pre class="html"><code class="language-javascript"><script>
function func1(){
alert("this window.onload");</code></pre>
<pre><code class="language-html"> window.onload = func1;//カッコをつけないで複数の呼び出し方法はwindowです.onload = function(){func1();func2()}
くどくど:バックエンドの技術を学んで、今jsが基本的に役に立たないことを発見して、今jspを使ってフロントエンドのページをしないため、至る所jsの静的なページに対するパッケージで、それから前後のインタラクティブを実現します.今jsの機能が本当に強いことを発見して、ページに対して各種の修正ができて、本当に先端のjs技術で十分です.
実は私がjsのページをたくさん見たとき、頭がぼんやりしていて、どのように実行すればいいか全然分かりませんでしたが、彼は他のプログラミング言語と似ていて、関数、変数などがあります.もうくだらないことを言わないでください.
一、jsのHTMLでの使用:
1、jsはhtmlのheadとbodyの内部で定義することができ、ラベルによって導入することができ、scriptラベルによってjsファイルを導入することができ、ラベルの内部に直接jsコード<を書くことができる./span></p>
<p><span></span><span style="font-size:14px;">2、jsはページ定義の位置によって上から下まで識別される.認識の意味は実行ではなく,定義された関数をコンパイルすることである.では、どのように実行しますか?</span></p>
<p><span></span>2.1、最も簡単な方法はHTMLのラベルに直接書くことです:<span> </span></p>
<p><span></span></p>
<pre><code class="language-html"><html> <body οnlοad="func1();func2();func3();"></body> </html></code></pre>
<p><span></span>2.2、Windowsオブジェクトで呼び出す:<span> </span></p>
<p><span></span></p>
<pre><code class="language-javascript"></code></pre>
<pre class="html"><code class="language-javascript"><script>
function func1(){
alert("this window.onload");</code></pre>
<pre><code class="language-html"> window.onload = func1;//カッコをつけないで複数の呼び出し方法はwindowです.onload = function(){func1();func2()}
2.3 立即执行函数:
(function(){alert(1);}());
(function(){alert(1);})();
, ! void
!function(){alert(1);}();
void function(){alert(2);}();
2.4 jsのwindowのため.loadメソッドはDOMのすべてのロードが完了するまで実行する必要があります.これは最も厳格なページロードが完了する実行メソッドです.jQueryはjsのパッケージと変更であり、jQueryではこの方法で実行できます.// DOM
$(document).ready(function(){
alert(1);
});
//
$(function(){
alert(1);
});
3、jsの中の関数の実行順序とコールバック関数
これは私がネット上で言っているのを見て、自分で以下のように実験しました.
まず、関数定義は大きく2つに分けられます.1つは定義式関数で、1つは賦値式関数です.//“ ”
function Fn1(){
alert("Hello World!");
}
//“ ”
var Fn2 = function(){
alert("Hello wild!");
}
ページはロード中に、ページ上またはロードされたjsファイルをスキャンし、定義式関数に遭遇した場合、前処理を行い、処理が完了した後、上から下へ実行を開始します.付与関数に遭遇すると、関数を変数に付与するだけで、前処理は行わず、呼び出されるまで処理します.次のコード//“ ”
Fn1();
function Fn1(){
alert("Hello World!");
} //
//“ ”
Fn2();
var Fn2 = function(){
alert("Hello wild!");
} //
2つ目は、内部関数の実行順序(内部順序実行)がonloadの呼び出しよりも早いことです.
onload
function func1(){
alert("this window.onload1");
}
function func2(){
alert("this window.onload2");
}
func2();
最後の問題は、自己実行関数です.
特殊な場合1、自己実行関数の前に付与関数があり、前に関数が実行されていない場合は、自己実行関数を先に実行し、前に定義した最後の付与関数を実行し、他の付与関数を呼び出すことができません.
4、jsのオブジェクトと属性
jsの中のオブジェクト、グローバル変数、方法は自動的にwindowのオブジェクトになります.これはw 3 cの勉強を参考にしてください.内容が多すぎて、調べません.http://www.w3school.com.cn/jsref/index.asp
二、jQueryの使用:
私たちはjsの機能が強いことを知っていますが、実現が複雑で、プログラマーは怠け者で、私たちは直接使う方法を持ってきたいと思っています.そのため、jsをカプセル化するいくつかのフレームワークがあります.jQueryはjavaを使ってjQueryを使うのが流行っています.(もちろんjQueryではすべてのjsメソッドが使用可能)
1.HTMLの前にjqueryを導入する.min.jsのファイルは次のjsにjqueryコードを書くことができます.
2、jQueryパッケージの方法、例えばセレクタの使用などの操作は参考にしてくださいhttp://www.jb51.net/shouce/jquery1.82/
3、jsでどのようにカスタムオブジェクトを作成するかここで話しましょう.最後にしましょう.
まず、ローカル変数とグローバル変数について説明します.var
jscript :
( function, Object o ={}) var ,
( function(){}, Object o={}) var , var
。
次の3つの方法でオブジェクトを作成できます. :
var obj = {
k1:value1,// ;
k2:value,
func: function(){};//
}
, , ( "") 。
, , , ""
, ;
new
var list = new Object();
lisi.name = " ";
lisi.say = function(){
console.log(" "+this.name);
}
function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
}
, new
var student = new person(" "," ","18","block");
最後に、オブジェクトのプロパティとメソッドをどのように読み取りますか?
1、演算子:オブジェクト内の場合:this.属性名.this.メソッド名();
オブジェクトの外部:オブジェクト名.属性名.オブジェクト名メソッド名();
2、[key]呼び出しにより、オブジェクト名[[属性名]オブジェクト名[[メソッド名]()
ヒント:keyに特殊な文字が含まれている場合は、第1の方法は使用できません.第2の方法を使用する必要があります.
オブジェクト内部の書き込み変数名はグローバル変数として黙認されているため、自分のオブジェクトのプロパティを呼び出すにはthisキーを使用する必要があります.
最後に、オブジェクトの属性またはメソッドを削除します.
deleteオブジェクト名属性名;deleteオブジェクト名メソッド名();
今からプロジェクトを见始めます.以上は初心者のまとめです.もしミスがあったら教えてください.
万丈のビルが地面を抜いて、この門に入ると海のように深い.