用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 相关文章推荐
Tips 带三角可关闭的文字提示
Oct 06 Javascript
分享27个jQuery 表单插件集合推荐
Apr 25 Javascript
js跨浏览器实现将字符串转化为xml对象的方法
Sep 25 Javascript
jquery中load方法的用法及注意事项说明
Feb 22 Javascript
node.js中的fs.exists方法使用说明
Dec 17 Javascript
关于js函数解释(包括内嵌,对象等)
Nov 20 Javascript
VueJs路由跳转——vue-router的使用详解
Jan 10 Javascript
vue中使用localstorage来存储页面信息
Nov 04 Javascript
关于Webpack dev server热加载失败的解决方法
Feb 22 Javascript
JavaScript callback回调函数用法实例分析
May 08 Javascript
详解key在Vue列表渲染时究竟起到了什么作用
Apr 20 Javascript
小程序跨页面交互的作用与方法详解
Jan 07 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数组的概述及分类与声明代码演示
2013/02/26 PHP
PHP微信支付开发实例
2016/06/22 PHP
CentOS 上搭建 PHP7 开发测试环境
2017/02/26 PHP
php json相关函数用法示例
2017/03/28 PHP
基于Laravel实现的用户动态模块开发
2017/09/21 PHP
Thinkphp 框架基础之源码获取、环境要求与目录结构分析
2020/04/27 PHP
模拟多级复选框效果的jquery代码
2013/08/13 Javascript
eclipse如何忽略js文件报错(附图)
2013/10/30 Javascript
封装的jquery翻页滚动(示例代码)
2013/11/18 Javascript
简单的邮箱登陆的提示效果类似于yahoo邮箱
2014/02/26 Javascript
jQuery 局部div刷新和全局刷新方法总结
2016/10/05 Javascript
基于jquery实现多选下拉列表
2017/08/02 jQuery
使用vuex缓存数据并优化自己的vuex-cache
2018/05/30 Javascript
用vue快速开发app的脚手架工具
2018/06/11 Javascript
JS浏览器BOM常见操作实例详解
2020/04/27 Javascript
[03:03]DOTA2 2017国际邀请赛开幕战队入场仪式
2017/08/09 DOTA
python中异常报错处理方法汇总
2016/11/20 Python
Python命令启动Web服务器实例详解
2017/02/23 Python
Python探索之SocketServer详解
2017/10/28 Python
Python学习_几种存取xls/xlsx文件的方法总结
2018/05/03 Python
python虚拟环境迁移方法
2019/01/03 Python
Python类的继承、多态及获取对象信息操作详解
2019/02/28 Python
详解pandas.DataFrame中删除包涵特定字符串所在的行
2019/04/04 Python
5行Python代码实现图像分割的步骤详解
2020/05/25 Python
使用CSS3制作版头动画效果
2020/12/24 HTML / CSS
美国领先的户外服装与装备用品店:Moosejaw
2016/08/25 全球购物
比较基础的php面试题及答案-编程题
2012/10/14 面试题
预备党员承诺书
2014/03/25 职场文书
拒绝黄毒毒宣传标语
2014/06/26 职场文书
委托书格式范文
2015/01/28 职场文书
物业工程部主管岗位职责
2015/04/16 职场文书
2015年幼儿教育工作总结
2015/07/24 职场文书
教师节主题班会方案
2015/08/17 职场文书
2016年第29个世界无烟日宣传活动总结
2016/04/06 职场文书
go xorm框架的使用
2021/05/22 Golang
python热力图实现的完整实例
2022/06/25 Python