用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 相关文章推荐
jquery实现效果比较好的table选中行颜色
Mar 25 Javascript
jquery实现的一个简单进度条效果实例
May 12 Javascript
本人自用的global.js库源码分享
Feb 28 Javascript
动态加载JavaScript文件的两种方法
Apr 22 Javascript
js实现纯前端的图片预览
Apr 27 Javascript
AngularJS教程之简单应用程序示例
Aug 16 Javascript
JavaScript中Math对象的方法介绍
Jan 05 Javascript
Vue 多层组件嵌套二种实现方式(测试实例)
Sep 08 Javascript
webpack打包react项目的实现方法
Jun 21 Javascript
JavaScript展开操作符(Spread operator)详解
Jul 20 Javascript
vue实现PC端分辨率适配操作
Aug 03 Javascript
vue-cli+webpack项目打包到服务器后,ttf字体找不到的解决操作
Aug 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
Yii 快速,安全,专业的PHP框架
2014/09/03 PHP
基于PHP+jQuery+MySql实现红蓝(顶踩)投票代码
2015/08/25 PHP
Smarty模板常见的简单应用分析
2016/11/15 PHP
php用户名的密码加密更安全的方法
2019/06/21 PHP
更正确的asp冒泡排序
2007/05/24 Javascript
javascript 词法作用域和闭包分析说明
2010/08/12 Javascript
关于jQuery中的end()使用方法
2011/07/10 Javascript
浅析JavaScript中浏览器的兼容问题
2016/04/19 Javascript
Nodejs从有门道无门菜鸟起飞必看教程
2016/07/20 NodeJs
Angular多选、全选、批量选择操作实例代码
2017/03/10 Javascript
NodeJS 中Stream 的基本使用
2018/07/30 NodeJs
JavaScript代码实现微博批量取消关注功能
2021/02/05 Javascript
python学习之编写查询ip程序
2016/02/27 Python
Python脚本实现虾米网签到功能
2016/04/12 Python
Python实现多线程HTTP下载器示例
2017/02/11 Python
python实现批量解析邮件并下载附件
2018/06/19 Python
Python中pandas模块DataFrame创建方法示例
2018/06/20 Python
Python实现的json文件读取及中文乱码显示问题解决方法
2018/08/06 Python
python 并发编程 非阻塞IO模型原理解析
2019/08/20 Python
详解如何在pyqt中通过OpenCV实现对窗口的透视变换
2020/09/20 Python
Python如何利用Har文件进行遍历指定字典替换提交的数据详解
2020/11/05 Python
CSS3 box-sizing属性详解
2016/11/15 HTML / CSS
HTML5 语音搜索只需一句代码
2013/01/03 HTML / CSS
html5移动端自适应布局的实现
2020/04/15 HTML / CSS
德国原装品牌香水、化妆品和手表网站:BRASTY.DE
2016/10/16 全球购物
澳大利亚礼品卡商店:Gift Card Store
2019/06/24 全球购物
销售业务员岗位职责
2014/01/29 职场文书
文秘大学生求职信
2014/02/25 职场文书
工程采购员岗位职责
2014/03/09 职场文书
中学生期中自我鉴定
2014/04/20 职场文书
本科毕业论文导师评语
2014/12/31 职场文书
个人总结与自我评价2015
2015/03/11 职场文书
加薪申请书应该这样写!
2019/07/04 职场文书
html实现随机点名器的示例代码
2021/04/02 Javascript
Vue过滤器(filter)实现及应用场景详解
2021/06/15 Vue.js
浅谈sql_@SelectProvider及使用注意说明
2021/08/04 Java/Android