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 相关文章推荐
新浪中用来显示flash的函数
Apr 02 Javascript
GreyBox技术总结(转)
Nov 23 Javascript
Jquery下attr和removeAttr的使用方法
Dec 28 Javascript
javaScript同意等待代码实现心得
Jan 01 Javascript
JavaScript类的写法
Sep 17 Javascript
JavaScript获取中英文混合字符串长度的方法示例
Feb 04 Javascript
微信小程序wx.getImageInfo()如何获取图片信息
Jan 26 Javascript
Bootstrap Table实现定时刷新数据的方法
Aug 13 Javascript
解决eclipse中没有js代码提示的问题
Oct 10 Javascript
vue实现短信验证码输入框
Apr 17 Javascript
Vue+Element UI实现概要小弹窗的全过程
May 30 Vue.js
使用react+redux实现计数器功能及遇到问题
Jun 02 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
当年上海收录机产品生产,进口和价格情况
2021/03/04 无线电
apache+php+mysql安装配置方法小结
2010/08/01 PHP
深入PHP FTP类的详解
2013/06/13 PHP
浅析ThinkPHP的模板输出功能
2014/07/01 PHP
php获得文件大小和文件创建时间的方法
2015/03/13 PHP
php生成过去100年下拉列表的方法
2015/07/20 PHP
php面向对象值单例模式
2016/05/03 PHP
动态表单验证的操作方法和TP框架里面的ajax表单验证
2017/07/19 PHP
Ubuntu上安装yaf扩展的方法
2018/01/29 PHP
详解PHP的抽象类和抽象方法以及接口总结
2019/03/15 PHP
javascript 文本框水印/占位符(watermark/placeholder)实现方法
2012/01/15 Javascript
js 实现菜单左右滚动显示示例介绍
2013/11/21 Javascript
了不起的node.js读书笔记之node.js中的特性
2014/12/22 Javascript
JavaScript在浏览器标题栏上显示当前日期和时间的方法
2015/03/19 Javascript
JS仿Base.js实现的继承示例
2017/04/07 Javascript
JS简单实现自定义右键菜单实例
2017/05/31 Javascript
Vue组件创建和传值的方法
2018/08/17 Javascript
JavaScript代码调试方法实例小结
2019/01/05 Javascript
史上最为详细的javascript继承(推荐)
2019/05/18 Javascript
Vue的click事件防抖和节流处理详解
2019/11/13 Javascript
Python和Perl绘制中国北京跑步地图的方法
2016/03/03 Python
python实现泊松图像融合
2018/07/26 Python
Python中collections模块的基本使用教程
2018/12/07 Python
Python作用域与名字空间原理详解
2020/03/21 Python
CSS3中的transform属性进行2D和3D变换的基本用法
2016/05/12 HTML / CSS
Urban Outfitters英国官网:美国平价服饰品牌
2016/11/25 全球购物
System.Array.CopyTo()和System.Array.Clone()有什么区别
2016/06/20 面试题
教师师德教育的自我评价
2013/10/31 职场文书
应届生会计求职信
2013/11/11 职场文书
护士自我鉴定怎么写
2014/02/07 职场文书
中药专业毕业自荐书范文
2014/02/08 职场文书
列车乘务员工作不细心检讨书
2014/10/07 职场文书
大学生个人简历自我评价
2015/03/11 职场文书
又涨知识了,自律到底多重要?
2019/06/27 职场文书
小程序后台PHP版本部署运行 LNMP+WNMP
2021/04/01 Servers
Mysql数据库手动及定时备份步骤
2021/11/07 MySQL