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 相关文章推荐
textarea的value是html文件源代码,存成html文件的代码
Apr 20 Javascript
由document.body和document.documentElement想到的
Apr 13 Javascript
javascript与webservice的通信实现代码
Dec 25 Javascript
js一般方法改写成面向对象方法的无限级折叠菜单示例代码
Jul 04 Javascript
基于jQuery实现文本框缩放以及上下移动功能
Nov 24 Javascript
jQuery中[attribute!=value]选择器用法实例
Dec 31 Javascript
js鼠标点击图片切换效果代码分享
Aug 26 Javascript
Javascript实现的简单右键菜单类
Sep 23 Javascript
JS常用加密编码与算法实例总结
Dec 22 Javascript
10个最优秀的Node.js MVC框架
Aug 24 Javascript
vue实现侧边栏导航效果
Oct 21 Javascript
vue element实现表格合并行数据
Nov 30 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
PHP 数组入门教程小结
2009/05/20 PHP
关于PHP结束标签的使用细节探讨及联想
2013/03/04 PHP
php中stream(流)的用法
2014/03/25 PHP
一个PHP的ZIP压缩类分享
2014/05/04 PHP
Zend Framework+smarty用法实例详解
2016/03/19 PHP
PHP编程快速实现数组去重的方法详解
2017/07/22 PHP
将CKfinder整合进CKEditor3.0的新方法
2010/01/10 Javascript
DIV外区域Click后关闭DIV的实现代码
2011/12/21 Javascript
JS返回iframe中frameBorder属性值的方法
2015/04/01 Javascript
jQuery-1.9.1源码分析系列(十一)DOM操作续之克隆节点
2015/12/01 Javascript
jsonp跨域请求数据实现手机号码查询实例分析
2015/12/12 Javascript
jQuery表格的维护和删除操作
2017/02/03 Javascript
jQuery阻止移动端遮罩层后页面滚动
2017/03/15 Javascript
Angular.Js中ng-include指令的使用与实现
2017/05/07 Javascript
详解Vue的钩子函数(路由导航守卫、keep-alive、生命周期钩子)
2018/07/24 Javascript
JS错误处理与调试操作实例分析
2020/04/13 Javascript
微信小程序scroll-view实现滚动到锚点左侧导航栏点餐功能(点击种类,滚动到锚点)
2020/06/11 Javascript
Jquery $.map使用方法实例详解
2020/09/01 jQuery
python获取当前计算机cpu数量的方法
2015/04/18 Python
python 3.6.5 安装配置方法图文教程
2018/09/18 Python
用python求一个数组的和与平均值的实现方法
2019/06/29 Python
python 图像判断,清晰度(明暗),彩色与黑白实例
2020/06/04 Python
Python 程序报错崩溃后如何倒回到崩溃的位置(推荐)
2020/06/23 Python
来自美国主售篮球鞋的零售商店:KICKSUSA
2017/11/28 全球购物
Herve Leger官网:标志性绷带连衣裙等
2018/12/26 全球购物
德国帽子专家:Hutshopping
2019/11/03 全球购物
如何将无状态会话Bean发布为WEB服务,只有无状态会话Bean可以发布为WEB服务?
2015/12/03 面试题
自我评价正确写法范文
2013/12/10 职场文书
领导班子党的群众路线教育实践活动对照检查材料
2014/09/25 职场文书
涉及车辆房产分割的离婚协议书范文
2014/10/12 职场文书
元旦主持词开场白
2015/05/29 职场文书
党风廉政教育心得体会2016
2016/01/22 职场文书
2019年描写人生经典诗句大全
2019/07/08 职场文书
导游词之吉林吉塔
2019/11/11 职场文书
导游词之青岛太清宫
2019/12/13 职场文书
详解如何修改nginx的默认端口
2021/03/31 Servers