博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
JS动态创建元素
阅读量:4325 次
发布时间:2019-06-06

本文共 723 字,大约阅读时间需要 2 分钟。

动态创建元素的三种方法:

第一种document.write("")

document.write("<input type=‘text’>  value='456'>");

相当于创建了一个默认名是456的输入框

function f1(){

        document.write("<input type='text' value='999999'>");
    }

但是当document.write("")写在函数中时,会冲刷掉之前的页面元素,之前的document都不显示,所以少用或者不用document.write("")创建元素

 

第二种innerHTML创建元素

要注意尽量不要频繁的拼接字符串

div.innerHTML+="<input type='text' value='999999'>";   

字符串具有不可变性,会重复开辟内存空间,要注意优化

优化版本就是放在数组中

 

第三种document.createElement

var ul = document.createElement("ul");

 

移除节点

var ul = document.createElement("ul");

在前面插入节点

insertBefore

var n1 = lis[2].cloneNode(true);

ul.insertBefore(n1,lis[0]);                 第一个参数是要插入的节点,第二个参数是插入的位置

 

两个键盘事件:

 onkeydown: 鼠标按下时触发,不会获得当前输入的内容

 onkeyup :键盘按下并抬起时才触发,会获得输入的内容

转载于:https://www.cnblogs.com/sw1990/p/5759353.html

你可能感兴趣的文章
求一个数的整数次方
查看>>
点云PCL中小细节
查看>>
铁路信号基础
查看>>
Django 学习笔记(五) --- Ajax 传输数据
查看>>
Spring boot 日志 Logback
查看>>
基于OWIN WebAPI 使用OAUTH2授权服务【授权码模式(Authorization Code)】
查看>>
[深入Maven源代码]maven绑定命令行参数到具体插件
查看>>
laravel 分页使用
查看>>
RobotFramework自动化2-自定义关键字
查看>>
centos6.4-x86-64系统更新系统自带Apache Http Server
查看>>
[置顶] 【cocos2d-x入门实战】微信飞机大战之三:飞机要起飞了
查看>>
BABOK - 需求分析(Requirements Analysis)概述
查看>>
第43条:掌握GCD及操作队列的使用时机
查看>>
Windows autoKeras的下载与安装连接
查看>>
CMU Bomblab 答案
查看>>
微信支付之异步通知签名错误
查看>>
2016 - 1 -17 GCD学习总结
查看>>
linux安装php-redis扩展(转)
查看>>
Vue集成微信开发趟坑:公众号以及JSSDK相关
查看>>
vue项目开发之v-for列表渲染的坑
查看>>