jQuery DOM ノードとノードのプロパティ

JavaScript を介して DOM ノードを簡単に取得して、一連の DOM 操作を実行できます。しかし実際には、ほとんどの開発者は最初に HTML 構造を定義することに慣れていますが、これは非常に柔軟性に欠けます。

次の状況を想像してください: AJAX を通じてデータを取得した後に構造を決定できる場合、この状況ではノードの動的な処理が必要になります

この記事では、JavaScript を使用して div ノード要素を作成する方法を紹介します。主に作成を含みます。大きく 2 つの部分があります。 div ノード要素の属性と div ノード要素の作成スタイルについては、この記事が必ず何かを得るのに役立つと思います。

ノードの作成

作成プロセス:

-例を見てみましょう

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
    <script>
        $(function(){
            var $li1 = $("<li>php中文网</li>");  //创建第一个li 标签
            var $li2 = $("<li>php.cn</li>");  //创建第二个li 标签

            $("ul").append($li1);  //添加到<ul>节点中,<ul>节点是<li>的父节点
        })
    </script>
</head>
<body>
    <ul></ul>

</body>
</html>

上記のコードでは、ラベル内のテキスト コンテンツは通常テキストと呼ばれます。ノード

学び続ける
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script> <script> $(function(){ var $li1 = $("<li>php中文网</li>"); //创建第一个li 标签 var $li2 = $("<li>php.cn</li>"); //创建第二个li 标签 $("ul").append($li1); //添加到<ul>节点中,<ul>节点是<li>的父节点 }) </script> </head> <body> <ul></ul> </body> </html>