Gemeinschaft Lernen Tools-Bibliothek Freizeit
suchen
Deutsch

jQuery DOM节点和节点属性

通过JavaScript可以很方便的获取DOM节点，从而进行一系列的DOM操作。但实际上一般开发者都习惯性的先定义好HTML结构，但这样就非常不灵活了。

试想下这样的情况：如果我们通过AJAX获取到数据之后然后才能确定结构的话，这种情况就需要动态的处理节点了

本文向大家介绍一下如何使用JavaScript创建div节点元素，主要包括创建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>

如上代码，我们就已经创建了俩个节点    标签中的文字内容，我们通常称为文本节点

Weiter lernen
||
<!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>
einreichenCode zurücksetzen
Vorherige Sektion nächsten Abschnitt
Tutorial-Liste
Hilfe bekommen
  • Kursempfehlungen
  • Kursunterlagen herunterladen
Die Kursunterlagen stehen derzeit nicht zum Download zur Verfügung. Die Mitarbeiter organisieren es derzeit. Bitte schenken Sie diesem Kurs in Zukunft mehr Aufmerksamkeit

Auch Studierende, die diesen Kurs gesehen haben, lernen

Das neueste Video-Tutorial zur Weltpremiere von ThinkPHP 5.1 (60 Tage zum Online-Schulungskurs zum PHP-Experten)  492837 spielt ab