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 相关文章推荐
IE和FireFox(FF)中js和css的不同
Apr 13 Javascript
jcarousellite.js 基于Jquery的图片无缝滚动插件
Dec 30 Javascript
javascript验证上传文件的类型限制必须为某些格式
Nov 14 Javascript
JavaScript中windows.open()、windows.close()方法详解
Jul 28 Javascript
AngularJS入门教程之REST和定制服务详解
Aug 19 Javascript
Bootstrap CSS组件之下拉菜单(dropdown)
Dec 17 Javascript
详解JavaScript树结构
Jan 09 Javascript
用move.js库实现百叶窗特效
Feb 08 Javascript
es6学习笔记之Async函数的使用示例
May 11 Javascript
详解webpack+vue-cli项目打包技巧
Jun 17 Javascript
jquery ajax异步提交表单数据的方法
Oct 27 jQuery
使用layer模态框给新页面传值的方法
Sep 27 Javascript
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
编译php 5.2.14+fpm+memcached(具体操作详解)
2013/06/18 PHP
PHP的运行机制与原理(底层)
2015/11/16 PHP
PHP开发实现快递查询功能详解
2019/04/08 PHP
PHP实现提高SESSION响应速度的几种方法详解
2019/08/09 PHP
PHP的new static和new self的区别与使用
2019/11/27 PHP
JavaScript中的作用域链和闭包
2012/06/30 Javascript
javascript类型转换示例
2014/04/29 Javascript
在Node.js中实现文件复制的方法和实例
2014/06/05 Javascript
jQuery实现仿美橙互联两级导航菜单的方法
2015/03/09 Javascript
基于JS实现的倒计时程序实例
2015/07/24 Javascript
JavaScript操作URL的相关内容集锦
2015/10/29 Javascript
jQuery实现的指纹扫描效果实例(附演示与demo源码下载)
2016/01/26 Javascript
详解Angularjs中的依赖注入
2016/03/11 Javascript
JavaScript中const、var和let区别浅析
2016/10/11 Javascript
Webpack执行命令参数详解
2017/06/17 Javascript
Vue 项目部署到服务器的问题解决方法
2017/12/05 Javascript
JS实现深度优先搜索求解两点间最短路径
2019/01/17 Javascript
关于vue2强制刷新,解决页面不会重新渲染的问题
2019/10/29 Javascript
微信小程序自定义菜单切换栏tabbar组件代码实例
2019/12/30 Javascript
微信小程序实现音频文件播放进度的实例代码
2020/03/02 Javascript
[01:22:28]DOTA2-DPC中国联赛 正赛 SAG vs RNG BO3 第一场 1月18日
2021/03/11 DOTA
Python实现树的先序、中序、后序排序算法示例
2017/06/23 Python
python+mongodb数据抓取详细介绍
2017/10/25 Python
Python3多线程爬虫实例讲解代码
2018/01/05 Python
python如何读写json数据
2018/03/21 Python
详谈在flask中使用jsonify和json.dumps的区别
2018/03/26 Python
python 限制函数执行时间,自己实现timeout的实例
2019/01/12 Python
DataFrame.to_excel多次写入不同Sheet的实例
2019/12/02 Python
pytorch GAN伪造手写体mnist数据集方式
2020/01/10 Python
Python filter过滤器原理及实例应用
2020/08/18 Python
COSETTE官网:奢华,每天
2020/03/22 全球购物
什么是类的返射机制
2016/02/06 面试题
女大学生自我鉴定
2013/12/09 职场文书
软件研发工程师岗位职责
2014/09/30 职场文书
酒店销售经理岗位职责
2015/04/02 职场文书
python解析json数据
2022/04/29 Python