js和jquery对dom节点的操作(创建/追加)


Posted in Javascript onApril 21, 2013
<script src="jquery-1.9.1.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(function () { 
$('#Button1').click(function () { 
// var ha = '<p>a</p>'; 
// $('div').append(ha); 
//1 
// var w = '<a href="#">f4</a>' 
// $('div').append(w); 
// var sele = '<select><option>1</option><option>2</option><option>3</option></select>' 
// $('div').append(sele); 
}) 
}) 
//2var pstr = '<p><b><i>白日依山尽</br>黄河入海流</br>欲穷千里目</br>更上一层楼</i></b></p>'; $('div').append(pstr);将其改成用js来写,效果一样 
function ha() { 
// var p= document.createElement('p'); 
// var b = document.createElement('b'); 
// var i = document.createElement('i'); 
// var neirong1 = document.createTextNode('白日依山尽'); 
// var br1=document.createElement('br') 
// var neirong2 = document.createTextNode('黄河入海流'); 
// var br2 = document.createElement('br') 
// var neirong3 = document.createTextNode('欲穷千里目'); 
// var br3 = document.createElement('br') 
// var neirong4 = document.createTextNode('更上一层楼'); 
// i.appendChild(neirong1); 
// i.appendChild(br1); 
// i.appendChild(neirong2); 
// i.appendChild(br2); 
// i.appendChild(neirong3); 
// i.appendChild(br3); 
// i.appendChild(neirong4); 
// 
// b.appendChild(i); 
// p.appendChild(b); 
// document.getElementById('div1').appendChild(p); 
} 
</script> 
</head> 
<body> 
<input id="Button1" type="button" value="创建节点" /> 
<input id="Button2" type="button" value="2" onclick="ha()" /> 
<div id="div1"></div>
Javascript 相关文章推荐
JS URL传中文参数引发的乱码问题
Sep 02 Javascript
javascript 解析url的search方法
Feb 09 Javascript
Javascript中的异步编程规范Promises/A详细介绍
Jun 06 Javascript
jQuery中多个元素的Hover事件解决方案
Jun 12 Javascript
JavaScript中字符串拼接的基本方法
Jul 07 Javascript
node.JS md5加密中文与php结果不一致的解决方法
May 05 Javascript
bootstrap select下拉搜索插件使用方法详解
Nov 23 Javascript
vue-cli项目优化方法- 缩短首屏加载时间
Apr 01 Javascript
js实现延迟加载的几种方法详解
Jan 19 Javascript
Element-ui中元素滚动时el-option超出元素区域的问题
May 30 Javascript
jQuery实现简单评论功能
Aug 19 jQuery
Vue如何实现变量表达式选择器
Feb 18 Vue.js
jquery获取焦点和失去焦点事件代码
Apr 21 #Javascript
jQuery获取注册信息并提示实现代码
Apr 21 #Javascript
jQuery隔行变色与普通JS写法的对比
Apr 21 #Javascript
jQuery模拟超链接点击效果代码
Apr 21 #Javascript
jquery 元素控制(追加元素/追加内容)介绍及应用
Apr 21 #Javascript
jquery 动态创建元素的方式介绍及应用
Apr 21 #Javascript
jQuery弹出(alert)select选择的值
Apr 21 #Javascript
You might like
删除无限分类并同时删除它下面的所有子分类的方法
2010/08/08 PHP
MySQL的FIND_IN_SET函数使用方法分享
2012/03/27 PHP
php教程 插件机制在PHP中实现方案
2012/11/02 PHP
php计算两个坐标(经度,纬度)之间距离的方法
2015/04/17 PHP
php将图片文件转换成二进制输出的方法
2015/06/10 PHP
PHP中如何防止外部恶意提交调用ajax接口
2016/04/11 PHP
JS window.opener返回父页面的应用
2009/10/24 Javascript
Javascript下IE与Firefox下的差异兼容写法总结
2010/06/18 Javascript
JavaScript高级程序设计 DOM学习笔记
2011/09/10 Javascript
mailto的使用技巧分享
2012/12/21 Javascript
简单的Jquery全选功能
2013/11/07 Javascript
使用jQuery简单实现模拟浏览器搜索功能
2014/12/21 Javascript
Jquery简单实现GridView行高亮的方法
2015/06/15 Javascript
js表单验证实例讲解
2016/03/31 Javascript
老司机带你解读jQuery插件开发流程
2016/05/16 Javascript
jquery操作select取值赋值与设置选中实例
2017/02/28 Javascript
vue + typescript + video.js实现 流媒体播放 视频监控功能
2019/07/07 Javascript
jquery选择器和属性对象的操作实例分析
2020/01/10 jQuery
javascript实现获取中文汉字拼音首字母
2020/05/19 Javascript
如何在vue-cli中使用css-loader实现css module
2021/01/07 Vue.js
[03:04]DOTA2英雄基础教程 影魔
2013/12/11 DOTA
[01:02:02]DOTA2上海特级锦标赛A组败者赛 EHOME VS CDEC第二局
2016/02/25 DOTA
[01:29:17]RNG vs Liquid 2019国际邀请赛淘汰赛 败者组 BO3 第二场 8.23
2019/09/05 DOTA
Python ldap实现登录实例代码
2016/09/30 Python
python使用str &amp; repr转换字符串
2016/10/13 Python
Windows安装Python、pip、easy_install的方法
2017/03/05 Python
python版opencv摄像头人脸实时检测方法
2018/08/03 Python
Python基于BeautifulSoup和requests实现的爬虫功能示例
2019/08/02 Python
python 接口实现 供第三方调用的例子
2019/08/13 Python
Python之关于类变量的两种赋值区别详解
2020/03/12 Python
python math模块的基本使用教程
2021/01/16 Python
Python如何实现单例模式
2016/06/03 面试题
保送生自荐信范文
2013/10/06 职场文书
党支部创先争优承诺书
2014/08/30 职场文书
作文评语集锦
2014/12/25 职场文书
Vue全局事件总线你了解吗
2022/02/24 Vue.js