用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 相关文章推荐
javascript实现仿银行密码输入框效果的代码
Dec 13 Javascript
基于jquery的合并table相同单元格的插件(精简版)
Apr 05 Javascript
JavaScript自动设置IFrame高度的小例子
Jun 08 Javascript
jQuery插件的写法分享
Jun 12 Javascript
JQuery+Ajax无刷新分页的实例代码
Feb 08 Javascript
javascript使用正则获取url上的某个参数
Sep 04 Javascript
用C/C++来实现 Node.js 的模块(二)
Sep 24 Javascript
深入浅析JavaScript中数据共享和数据传递
Apr 25 Javascript
javaScript 事件绑定、事件冒泡、事件捕获和事件执行顺序整理总结
Oct 10 Javascript
jQuery删除当前节点元素
Dec 07 Javascript
超级简易的JS计算器实例讲解(实现加减乘除)
Aug 08 Javascript
js 将多个对象合并成一个对象 assign方法的实现
Sep 24 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/08/06 PHP
使用PHP和HTML5 FormData实现无刷新文件上传教程
2014/09/06 PHP
PHP实现设计模式中的抽象工厂模式详解
2014/10/11 PHP
php修改文件上传限制方法汇总
2015/04/07 PHP
利用ajax和PHP实现简单的流程管理
2017/03/23 PHP
PHP开启目录引索+fancyindex漂亮目录浏览带搜索功能
2019/09/23 PHP
js对象数组按属性快速排序
2011/01/31 Javascript
纯JS实现五子棋游戏兼容各浏览器(附源码)
2013/04/24 Javascript
MVVM模式中ViewModel和View、Model有什么区别?
2015/06/19 Javascript
使用DNode实现php和nodejs之间通信的简单实例
2015/07/06 NodeJs
JS实现漂亮的淡蓝色滑动门效果代码
2015/09/23 Javascript
jquery mobile开发常见问题分析
2016/01/21 Javascript
Node.js中Request模块处理HTTP协议请求的基本使用教程
2016/03/31 Javascript
AngularJs Injecting Services Into Controllers详解
2016/09/02 Javascript
AngularJS通过$location获取及改变当前页面的URL
2016/09/23 Javascript
react.js 翻页插件实例代码
2017/01/19 Javascript
Vue生命周期示例详解
2017/04/12 Javascript
vue使用vue-cli快速创建工程
2017/07/28 Javascript
详解Vue之父子组件传值
2019/04/01 Javascript
vue父子组件通信的高级用法示例
2019/08/29 Javascript
vue3+typeScript穿梭框的实现示例
2020/12/29 Vue.js
Python3模拟登录操作实例分析
2019/03/12 Python
Python3.5 Pandas模块之Series用法实例分析
2019/04/23 Python
关于python3中setup.py小概念解析
2019/08/22 Python
python爬虫中多线程的使用详解
2019/09/23 Python
python构建指数平滑预测模型示例
2019/11/21 Python
python爬虫基础之urllib的使用
2020/12/31 Python
德国古洛迷亚百货官网:GALERIA Kaufhof
2017/06/20 全球购物
Omio波兰:全欧洲低价大巴、火车和航班搜索和比价
2018/02/16 全球购物
Happy Socks英国官网:购买五颜六色的袜子
2020/11/03 全球购物
电子技术专业中专生的自我评价
2013/12/17 职场文书
党员违纪检讨书
2015/05/05 职场文书
2015年度校学生会工作总结报告
2015/05/23 职场文书
南京南京观后感
2015/06/02 职场文书
高一军训感想
2015/08/07 职场文书
写好Python代码的几条重要技巧
2021/05/21 Python