用js动态添加html元素,以及属性的简单实例


Posted in Javascript onJuly 19, 2016

用js动态添加html元素,以及属性的简单实例

function test(){

//创建节点

var lswt_2=document.createElement("div");

//设置节点id

lswt_2.id='lswtColse';

//设置节点属性

lswt_2.style.width='11px';
lswt_2.style.height='10px';
lswt_2.style.top='0px';
lswt_2.style.right='0px';
lswt_2.style.position='absolute';
lswt_2.style.background='url(7.gif)';
lswt_2.style.backgroundRepeat='no-repeat';

//为这个节点添加点击时间

lswt_4.addEventListener("click",loc,false);

//把这个节点放到那里?放到id为lswt的元素下

var element_2=document.getElementById("lswt");

//插入这个节点

element_2.appendChild(lswt_2);

}

以上这篇用js动态添加html元素,以及属性的简单实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
兼容Mozilla必须知道的知识。
Jan 09 Javascript
jquery下组织javascript代码(js函数化)
Aug 25 Javascript
js修改table中Td的值(定义td的双击事件)
Jan 10 Javascript
jquery怎样实现ajax联动框(一)
Mar 08 Javascript
js 图片随机不定向浮动的实现代码
Jul 02 Javascript
JS小功能(操作Table--动态添加删除表格及数据)实现代码
Nov 28 Javascript
Bootstrap每天必学之弹出框(Popover)插件
Apr 25 Javascript
JavaScript暂停和继续定时器的实现方法
Jul 18 Javascript
JavaScript设计模式之单体模式全面解析
Sep 09 Javascript
ES6中let 和 const 的新特性
Sep 03 Javascript
微信小程序自定义导航栏
Dec 31 Javascript
使用webpack编译es6代码的方法步骤
Apr 28 Javascript
详谈JS中实现种子随机数及作用
Jul 19 #Javascript
全面了解JavaScript对象进阶
Jul 19 #Javascript
EasyUI中在表单提交之前进行验证
Jul 19 #Javascript
jQuery EasyUI提交表单验证
Jul 19 #Javascript
js 动态添加元素(div、li、img等)及设置属性的方法
Jul 19 #Javascript
JS把内容动态插入到DIV的实现方法
Jul 19 #Javascript
JS动态给对象添加事件的简单方法
Jul 19 #Javascript
You might like
php木马攻击防御之道
2008/03/24 PHP
编写漂亮的代码 - 将后台程序与前端程序分开
2008/04/23 PHP
第五章 php数组操作
2011/12/30 PHP
PHP UTF8中文字符截断函数代码
2012/09/11 PHP
PHP判断文件是否存在、是否可读、目录是否存在的代码
2012/10/03 PHP
Destoon模板制作简明教程
2014/06/20 PHP
ThinkPHP中html:list标签用法分析
2016/01/09 PHP
浅谈php处理后端&接口访问超时的解决方法
2016/10/29 PHP
一个加载js文件的小脚本
2007/06/28 Javascript
File, FileReader 和 Ajax 文件上传实例分析(php)
2011/04/27 Javascript
IE网页js语法错误2行字符1、FF中正常的解决方法
2013/09/09 Javascript
js点击出现悬浮窗效果不使用JQuery插件
2014/01/20 Javascript
基于javascript实现图片滑动效果
2016/05/07 Javascript
用AngularJS来实现监察表单按钮的禁用效果
2016/11/02 Javascript
JavaScript实现的选择排序算法实例分析
2017/04/14 Javascript
vue实现登录后页面跳转到之前页面
2018/01/07 Javascript
Vue-Cli 3.0 中配置高德地图的两种方式
2019/06/19 Javascript
一篇文章弄懂javascript中的执行栈与执行上下文
2019/08/09 Javascript
vue双击事件2.0事件监听(点击-双击-鼠标事件)和事件修饰符操作
2020/07/27 Javascript
jdk1.8+vue elementui实现多级菜单功能
2020/09/24 Javascript
基于wxpython开发的简单gui计算器实例
2015/05/30 Python
python3.5 email实现发送邮件功能
2018/05/22 Python
解决安装python库时windows error5 报错的问题
2018/10/21 Python
Python面向对象程序设计多继承和多态用法示例
2019/04/08 Python
python清空命令行方式
2020/01/13 Python
Python爬虫中Selenium实现文件上传
2020/12/04 Python
CSS3 3D酷炫立方体变换动画的实现
2019/03/26 HTML / CSS
澳大利亚珠宝商:Shiels
2019/10/06 全球购物
大学生军训自我评价分享
2013/11/09 职场文书
个人银行贷款担保书
2014/04/01 职场文书
房地产公司见习自我鉴定
2014/04/28 职场文书
民族团结好少年事迹材料
2014/08/19 职场文书
社区护士演讲稿
2014/08/27 职场文书
赞助商致辞
2015/07/30 职场文书
JavaScript声明变量和数据类型的转换
2022/04/12 Javascript
关于mysql中string和number的转换问题
2022/06/14 MySQL