dom元素对象

最新推荐文章于 2023-05-02 22:27:58 发布

释xin

最新推荐文章于 2023-05-02 22:27:58 发布

阅读量138

点赞数 2

文章标签： accessKey appendChild DOM操作 HTML属性 JavaScript

本文链接：https://blog.csdn.net/Smallwhitestrive/article/details/116462598

版权

1、accessKey 属性可设置或返回访问单选按钮的快捷键，简单来说就是为元素添加获取的快捷键语法：HTMLElementObject.accessKey=accessKey

2、如果文档树中已经存在了 newchild，它将从文档树中删除，然后重新插入它的新位置。如果 newchild 是 DocumentFragment 节点，则不会直接插入它，
而是把它的子节点按序插入当前节点的 childNodes[] 数组的末尾。你可以使用 appendChild() 方法移除元素到另外一个元素。语法：node.appendChild(node)

代码：

<!DOCTYPE html>
<html>
   <head>
       <meta charset="UTF-8">
       <title></title>
   </head>
   <body οnclick="myfun()">
       <p id="p">按住alt+accesskey(我们自己定义的accesskey)返回文档中当前获得焦点的元素</p>
       <input type="text" value="我的accesskey为i" accesskey="i">
       <button accesskey="b" id="fu">我的accesskey为b</button>

       <button οnclick="clister()">点我去除button的监听事件</button>
       <p id="demo"></p>
       <p id="demo1"></p>

       <ul id="myList1"><li>小猫1号</li><li>小猫2号</li></ul>
       <ul id="myList2"><li>小狗1号</li><li>小狗2号</li></ul>
       <button οnclick="myfunct()">点我换小动物的位置</button>
       <button οnclick="myfuncti()">点我添加小动物</button>


       <script>
           //为文本元素添加一个点击函数，让我们很容易知道当前那个文本获得了焦点
           function myfun() {
               var x = document.activeElement.tagName;
               document.getElementById("demo").innerHTML = x;
           }
           //接下来为button元素添加一个监听事件addEventListener，当在button按钮上移动时，随机生成一个0-1的数字
           document.getElementById("fu").addEventListener("mousemove", myfunc);

           function myfunc() {
               document.getElementById("demo1").innerHTML = Math.random();
           };
           //移除监听事件
           function clister() {
               document.getElementById("fu").removeEventListener("mousemove", myfunc);
           };

           function myfunct() {
               var node = document.getElementById("myList2").lastChild;
               document.getElementById("myList1").appendChild(node);
           }

           function myfuncti() {
               var node = document.createElement("LI");
               var textnode = document.createTextNode("小猪1号");
               node.appendChild(textnode);
               document.getElementById("myList1").appendChild(node);
           }
       </script>
   </body>
</html>

效果：

好啦，今天的学习到此结束啦！感兴趣的小伙伴可以复制代码看看效果哦

释xin

关注

2
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
dom元素对象

1、accessKey 属性可设置或返回访问单选按钮的快捷键，简单来说就是为元素添加获取的快捷键语法：HTMLElementObject.accessKey=accessKey 2、如果文档树中已经存在了 newchild，它将从文档树中删除，然后重新插入它的新位置。如果 newchild 是 DocumentFragment 节点，则不会直接插入它，而是把它的子节点按序插入当前节点的 childNodes[] 数组的末尾。你可以使用 appendChild() 方...
复制链接

扫一扫