Verilog inout 端口使用和仿真-CFANZ编程社区

原贴连接

1.在整个文档范围内查询元素节点

功能	API	返回值
根据id值查询	document.getElementById(“id值”)	一个具体的元素节
根据标签名查询	document.getElementsByTagName(“标签名”)	元素节点数组
根据name属性值查询	document.getElementsByName(“name值”)	元素节点数组
根据类名查询	document.getElementsByClassName(“类名”)	元素节点数组

2 在具体元素节点范围内查找子节点

功能	API	返回值
查找子标签	element.children	返回子标签数组
查找第一个子标签	element.firstElementChild	标签对象
查找最后一个子标签	element.lastElementChild	节点对象

3 查找指定元素节点的父节点

功能	API	返回值
查找指定元素节点的父标签	element.parentElement	标签对象

4 查找指定元素节点的兄弟节点

功能	API	返回值
查找前一个兄弟标签	node.previousElementSibling	标签对象
查找后一个兄弟标签	node.nextElementSibling	标签对象

5 属性操作

需求	操作方式
读取属性值	元素对象.属性名
修改属性值	元素对象.属性名=新的属性值

6 标签体的操作

需求	操作方式
获取或者设置标签体的文本内容	element.innerText
获取或者设置标签体的内容	element.innerHTML

7 DOM增删改操作

API	功能
document.createElement(“标签名”)	创建元素节点并返回，但不会自动添加到文档中
document.createTextNode(“文本值”)	创建文本节点并返回，但不会自动添加到文档中
element.append(ele)	将ele添加到element元素中
element.appendChild(ele)	将ele添加到element所有子节点后面
parentEle.insertBefore(newEle,targetEle)	将newEle插入到targetEle前面
parentEle.replaceChild(newEle, oldEle)	用新节点替换原有的旧子节点
element.remove()	删除某个标签

8.doc实战

<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="UTF-8"/>
        <title>DOM操作</title>
        <script>
            window.onload = function(){
                //1.根据ID获取元素信息
                let p1 = document.getElementById('p1');
                console.log("p1",p1)

                //2.根据name属性获取元素信息
                let name1 = document.getElementsByName("name1");
                console.log("name1",name1.length);
                //alert(inputNames.length)
                name1[0].value = "aabbcc";

                //3.通过input标签获取元素
                let input1 = document.getElementsByTagName("input")
                console.log("input1",input1.length);
                //alert("input标签的个数:"+inputTags.length)
                input1[0].value = "112233";

                //4.通过class类型获取数据
                let class1 = document.getElementsByClassName("classTag");
                console.log("class1",class1.length);
                //alert("通过类型获取元素的个数:"+classTag.length)
                class1[0].value = "oooooo";

                //5.查找指定元素的子元素
                let children1 = document.getElementById("div1").children;
                console.log("children1",children1);
                //alert("子节点个数:"+childrens.length)
                children1[1].innerHTML = "nihai";
                
                //6.获取第一个子元素
                let firstP = document.getElementById('div1').firstElementChild;
                console.log("firstP",firstP);

                //7.获取最后一个子节点
                let lastP = document.getElementById('div1').lastElementChild;
                console.log("lastP",lastP);

                //8.根据指定元素,查找父节点
                let parentP = document.getElementById('p1').parentElement;
                console.log("parentP",parentP);

                //9.查找指定兄弟的 前一个
                let previousf = document.getElementById('p2').previousElementSibling;
                console.log("previousf",previousf);

                //10.查找指定兄弟元素的后一个
                let previousl = document.getElementById("p1").nextElementSibling;
                console.log("previousl",previousl);

                //11.获取元素属性和属性值  获取id="p1"的ID值
                let propertyId = document.getElementById('p1').id;
                console.log("propertyId",propertyId);

                //12 将id="p1" 修改为p3
                let propertyUp = document.getElementById('p1').id;
                propertyUp = 'p3';
                console.log("propertyUp",propertyUp);

                //13 获取标签体的内容
                let innerText = document.getElementById('p2').innerText;
                console.log("innerText",innerText);

                //14 修改id=p2标签体的内容
                let innserTextUp = document.getElementById('p2').innerText;
                innserTextUp = '而我在等你';
                console.log('innserTextUp',innserTextUp);

                //15 获取id=div1 的标签体内容
                let innerTextD = document.getElementById('div1').innerText;
                console.log('innerTextD',innerTextD);

                //16 修改id=div1的内容
                let innerTextUp = document.getElementById('div1').innerText;
                innerTextUp = '窗前明月光,疑似地上霜,举头望明月,低头思故乡.'; 
                console.log('innerTextUp',innerTextUp);
            }
        </script>
    </head>
    <body>
        <input type="text" name="name1" id="id" class="classTag">
        <div id="div1">
            <div id="p1">天青色等烟雨,</div>
            <div id="p2">而我在等你,</div>
            <p>炊烟袅袅升起,</p>
            <p>隔江千万里.</p>
        </div>
    </body>
</html>