zoukankan      html  css  js  c++  java
  • JS中两个节点的关系

    1,可能存在的关系

    parentNode(父节点)

    childNodes(子节点)

    firstChild

    lastChild

    nextSibling()

    previousSibling()

    2,插入节点

    object.appendChild()在后面插入

    object.insertChild()在前面插入

    3,删除节点 removeChild()

    4,替换元素节点replaceChild()

    5,创建元素节点document。createElement(tagName)  注意:tagName是字符串值,用来指定创建元素的类型

    6,创建文本节点createTextNode   data : 字符串值,可规定此节点的文本。

    在代码编辑器<script>标签中,创建一个P标签,设置className属性,使用createTextNode创建文本节点"I love JavaScript!"。

    // 先创建P
    var p=document.createElement("p");
    // 为P添加类名
    p.className="message";
    // 为P添加文本
    var ptext=document.createTextNode("I LOVE YOU");
    // 将文本传给P
    p.appendChild(ptext);
    // 将P传给body
    document.body.appendChild(p);

    innerHTML和createTextNode都可以把一段内容添加到一个节点中,区别是如果这段内容中有html标签(如例子中的<strong></strong>)时表现就不同了,在createTextNode中会当作文本处理,不会被浏览器解析,但用innerHTML就会被当作HTML代码处理(如你的例子中Hello会被加粗显示)。
    总的来说,如果你确定要插入的内容中没有html标签,可以用innerHTML,这样更简洁,但如果不能确定(比如要插入用户输入的内容)建议用createTextNode的方式。

  • 相关阅读:
    广域网(ppp协议、HDLC协议)
    0120. Triangle (M)
    0589. N-ary Tree Preorder Traversal (E)
    0377. Combination Sum IV (M)
    1074. Number of Submatrices That Sum to Target (H)
    1209. Remove All Adjacent Duplicates in String II (M)
    0509. Fibonacci Number (E)
    0086. Partition List (M)
    0667. Beautiful Arrangement II (M)
    1302. Deepest Leaves Sum (M)
  • 原文地址:https://www.cnblogs.com/monica123456/p/6464117.html
Copyright © 2011-2022 走看看