ホームページ >ウェブフロントエンド >jsチュートリアル >Geek Academy JavaScript ビデオ素材の共有

Geek Academy JavaScript ビデオ素材の共有

巴扎黑
巴扎黑オリジナル
2017-08-28 17:59:451338ブラウズ

「Geek Academy JavaScript ビデオ チュートリアル」では、JavaScript について詳しく紹介します。JavaScript は文字通りのスクリプト言語であり、クライアント側の Web 開発で広く使用されているスクリプト言語です。現在、デザインの改善、フォームの検証、ブラウザの検出、Cookie の作成などを目的として、何百万もの Web ページで使用されています。

JavaScript は、Web アプリケーション開発で広く使用されているネットワーク スクリプト言語であり、Web ページにさまざまな動的機能を追加して、ユーザーによりスムーズで美しいブラウジング効果を提供するためによく使用されます。通常、JavaScript スクリプトは HTML に埋め込むことでその機能を実現します。

はインタープリタ型スクリプト言語です (コードはプリコンパイルされていません)。

主に、HTML (標準ユニバーサル マークアップ言語に基づくアプリケーション) ページにインタラクティブな動作を追加するために使用されます。

HTML ページに直接埋め込むこともできますが、別の js ファイルとして記述すると、構造と動作を分離するのに役立ちます。

クロスプラットフォーム機能。ほとんどのブラウザーをサポートしているため、複数のプラットフォーム (Windows、Linux、Mac、Android、iOS など) で実行できます。

Geek Academy JavaScript ビデオ素材の共有

ビデオ再生アドレス: http://www.php.cn/course/204.html

JavaScriptを学習するとき、DOM操作に注意する必要があります。これがキーポイントであり、難しい点です。

1. ノードの作成


createElement()
var node = document.createElement(“div”);

言うまでもなく、要素ノードを作成しますが、このノードはドキュメントに自動的に追加されないことに注意してください。


2. テキスト ノードを作成します

createTextNode()
var value = document.createTextNode(“text”);

テキスト ノードを作成します。これは通常、要素ノードにコンテンツを追加するために使用され、ドキュメントには自動的には追加されません。

innerHTML は知っていますが、このメソッドは知りません。これにより、挿入されたコンテンツが HTML 形式でない場合は、createTextNode を使用する方が安全です。また、innerText にはブラウザーの非互換性の問題があるため、createTextNode を使用するのが簡単です。 。

3. ノードを最後まで挿入します

appendChild()
node.appendChild(value);

ノードを最後まで挿入します。上記で作成した 2 つのノードはドキュメントに自動的に追加されないため、appendChild を使用して挿入する必要があります。

新規ノードの場合は末尾に挿入され、既存のノードの場合は末尾に移動します この点を理解した上で、以下の方法と組み合わせると、ノードの移動や操作が簡単に行えます。

4. ターゲット ノードの前にノードを挿入します。

insertBefore()
var node = document.createElement(“div”);
var _p = document.createElement(“p”);
var _span = document.createElement(“span”);
node.appendChild(_p);
node.insertBefore(_span, _p);

2 番目のパラメータが記述されていない場合は、省略可能です。デフォルトでは、ドキュメントの最後に追加されます。これは、appendChild と同等です。

同様に、appendChild と insertBefore は、ノードが既に存在する場合、最初に元のノードを自動的に削除してから、指定した場所に移動します。
ノードを前面に移動するためのヒント:

if (node.parentNode.firstChild)
node.parentNode.insertBefore(node, node.parentNode.firstChild);else node.parentNode.appendChild(node);

node.cloneNode(true);

node.cloneNode(false);
上記の div ノードをコピーし、パラメーターを true にすると、ノード全体とその内容が false になり、コピーのみになります。ノードは内部のコンテンツを必要とせず、コピー後の新しいノードはドキュメントに自動的に挿入されません。挿入するには方法 3 と 4 を使用する必要があります。

6. ノードを削除します

removeChild()
node.removeChild(_p);

上記の

ノードを

から削除します。ただし、一般的には、削除するノードの親ノードが何であるかがわからないため、通常は次のように使用します。

以上がGeek Academy JavaScript ビデオ素材の共有の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。