zoukankan      html  css  js  c++  java
  • 动态创建元素

    动态创建元素:
                            document.createElement('元素名');
                            删除元素:
                                父级.removeChild(要删除的元素);
                            添加元素:
                                    父级.appendChild(要添加的元素) ---->往后面添加;
                                    父级.insertBefore(要添加的元素,添加到谁的前面) ---->往某个元素前面添加;
                            appendChild()和insertBefore()类似于剪切的功能;
     发送文字:
                                    window.onload=function(){
                                                    var oTxt=document.getElementById("txt");
                                                    var oBtn=document.getElementById("btn");
                                                    var oBox=document.getElementById("box")
                                                    
                                                    oBtn.onclick=function(){     //按钮点击添加新的li;
                                                        sendMess();
                                                    }
                                                    
                                                    oTxt.onkeydown=function(ev){  //oTxt,键盘按下添加新的li;
                                                                    var oEv=ev||event;
                                                                    if(oEv.keyCode==13){ //enter键
                                                                        sendMess();
                                                                    }
                                                    }
                                                    function sendMess(){
                                                                    var aLi=document.createElement('li');    //创建一个新元素;
                                                                    aLi.innerHTML=oTxt.value+'<a href="javascript:;">删除</a>';
                                                                    if(oBox.children.length){                                        //oBox.children.length为真,执行if
                                                                                oBox.insertBefore(aLi,oBox.children[0]);
                                                                    }
                                                                    else{oBox.appendChild(aLi);}
                                                                    oTxt.value='';
                                                                    aLi.children[0].onclick=function(){    //a点击从ul中删除整个li;
                                                                    oBox.removeChild(this.parentNode);
                                                                }
                                                    }
                                                    
                                                }

    人生如戏,或实力或演技
  • 相关阅读:
    练习1-17 编写一个程序,打印长度大于80个字符的所有输入行.
    练习1-16 修改打印最长文本行的程序的主程序main, 使之可以打印任意长度的输入行的长度, 并尽可能多的打印文本。
    惠普Z620工作站用安装版装win7旗舰版64位结果找不到硬盘
    输入元素( Input Element)
    GradientStop
    qml关键字style
    opacity
    QT5-step-by-step-LayoutManagement
    QT5-step-by-step-BasicKnowledge
    Adeneo Embedded: Building Qt 5.1 for Freescale i.MX6Introduction on LTIB
  • 原文地址:https://www.cnblogs.com/yang0902/p/5698109.html
Copyright © 2011-2022 走看看