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 相关文章推荐
深入理解JavaScript系列(13) This? Yes,this!
Jan 18 Javascript
基于jQuery捕获超链接事件进行局部刷新代码
May 10 Javascript
select标签模拟/美化方法采用JS外挂式插件
Apr 01 Javascript
扩展IE中一些不兼容的方法如contains、startWith等等
Jan 09 Javascript
js时间比较示例分享(日期比较)
Mar 05 Javascript
基于PHP和Mysql相结合使用jqGrid读取数据并显示
Dec 02 Javascript
javacript获取当前屏幕大小
Jun 04 Javascript
新手学习前端之js模仿淘宝主页网站
Oct 31 Javascript
JS中cookie的使用及缺点讲解
May 13 Javascript
详解vue-router2.0动态路由获取参数
Jun 14 Javascript
vue 实现小程序或商品秒杀倒计时
Apr 14 Javascript
微信小程序绑定手机号获取验证码功能
Oct 22 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扩展函数
2006/10/09 PHP
用php来检测proxy
2006/10/09 PHP
php cli换行示例
2014/04/22 PHP
php实现文章置顶功能的方法
2016/10/20 PHP
Js 获取当前日期时间及其它操作实现代码
2021/03/04 Javascript
jQuery布局插件UI Layout简介及使用方法
2013/04/03 Javascript
js获取页面description的方法
2015/05/21 Javascript
JS基于VML技术实现的五角星礼花效果代码
2015/10/26 Javascript
javascript精确统计网站访问量实例代码
2015/12/19 Javascript
基于JavaScript实现动态添加删除表格的行
2016/02/01 Javascript
最佳的JavaScript错误处理实践
2016/07/16 Javascript
Vue2.x中的父子组件相互通信的实现方法
2017/05/02 Javascript
vue引入axios同源跨域问题
2018/09/27 Javascript
VUE项目中加载已保存的笔记实例方法
2019/09/14 Javascript
微信小程序 点击切换样式scroll-view实现代码实例
2019/10/11 Javascript
[40:57]TI4 循环赛第二日 iG vs EG
2014/07/11 DOTA
整理Python最基本的操作字典的方法
2015/04/24 Python
Django框架中数据的连锁查询和限制返回数据的方法
2015/07/17 Python
python文件与目录操作实例详解
2016/02/22 Python
Python爬虫包BeautifulSoup简介与安装(一)
2018/06/17 Python
python plotly绘制直方图实例详解
2019/07/22 Python
Django 拆分model和view的实现方法
2019/08/16 Python
Ranorex通过Python将报告发送到邮箱的方法
2020/01/12 Python
python 实现简单的计算器(gui界面)
2020/11/11 Python
Selenium关闭INFO:CONSOLE提示的解决
2020/12/07 Python
python实现计算器简易版
2020/12/17 Python
python邮件中附加文字、html、图片、附件实现方法
2021/01/04 Python
NFL欧洲商店(德国):NFL Europe Shop DE
2018/11/03 全球购物
工厂厂长岗位职责
2013/11/08 职场文书
师范毕业生个人求职信
2013/12/09 职场文书
图书室管理制度
2014/01/19 职场文书
解除劳动关系协议书范文
2014/09/11 职场文书
省委召开党的群众路线教育实践活动总结大会报告
2014/10/21 职场文书
广告业务员岗位职责
2015/02/13 职场文书
2016学习依法治国心得体会
2016/01/15 职场文书
MySql如何将查询的出来的字段进行转换
2022/06/14 MySQL