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 绑定带参数的事件以及手动触发事件
Apr 27 Javascript
ExtJS PropertyGrid中使用Combobox选择值问题
Jun 13 Javascript
判断对象是否Window的实现代码
Jan 10 Javascript
javascript结合canvas实现图片旋转效果
May 03 Javascript
JavaScript和HTML DOM的区别与联系及Javascript和DOM的关系
Nov 15 Javascript
深入理解JavaScript中的浮点数
May 18 Javascript
BootStrap智能表单实战系列(四)表单布局介绍
Jun 13 Javascript
javascript判断回文数详解及实现代码
Feb 03 Javascript
javascript获取以及设置光标位置
Feb 16 Javascript
JavaScript中的一些实用小技巧总结
Apr 07 Javascript
jQuery-Citys省市区三级菜单联动插件使用详解
Jul 26 jQuery
36个正则表达式(开发效率提高80%)
Nov 17 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中的字符串函数
2006/11/24 PHP
php获得当前的脚本网址
2007/12/10 PHP
请离开include_once和require_once
2013/07/18 PHP
php简单随机字符串生成方法示例
2017/04/19 PHP
ThinkPHP实现生成和校验验证码功能
2017/04/28 PHP
实例讲解PHP表单处理
2019/02/15 PHP
PHP利用递归函数实现无限级分类的方法
2019/03/22 PHP
在laravel-admin中列表中禁止某行编辑、删除的方法
2019/10/03 PHP
date.parse在IE和FF中的区别
2010/07/29 Javascript
JavaScript ( (__ = !$ + $)[+$] + ({} + $)[_/_] +({} + $)[_/_] )
2011/02/25 Javascript
jQuery 开发者应该注意的9个错误
2012/05/03 Javascript
放弃用你的InnerHTML来输出HTML吧 jQuery Tmpl不详细讲解
2013/04/20 Javascript
微信小程序 生命周期和页面的生命周期详细介绍
2017/01/19 Javascript
JS基于递归实现网页版计算器的方法分析
2017/12/20 Javascript
jQuery中可见性过滤器简单用法示例
2018/03/31 jQuery
微信小程序使用npm支持踩坑
2018/11/07 Javascript
小程序封装wx.request请求并创建接口管理文件的实现
2019/04/29 Javascript
PHP webshell检查工具 python实现代码
2009/09/15 Python
Python发送以整个文件夹的内容为附件的邮件的教程
2015/05/06 Python
Python使用迭代器打印螺旋矩阵的思路及代码示例
2016/07/02 Python
简单实现python画圆功能
2018/01/25 Python
python抓取网页中链接的静态图片
2018/01/29 Python
pandas将numpy数组写入到csv的实例
2018/07/04 Python
python matplotlib实现双Y轴的实例
2019/02/12 Python
python3+pyqt5+itchat微信定时发送消息的方法
2019/02/20 Python
Python3 执行Linux Bash命令的方法
2019/07/12 Python
python如何查看网页代码
2020/06/07 Python
css3设置box-pack和box-align让div里面的元素垂直居中
2014/09/01 HTML / CSS
入党转预备思想汇报
2014/01/07 职场文书
大专会计自我鉴定
2014/02/06 职场文书
邻里守望志愿服务活动方案
2014/08/15 职场文书
入党函调证明材料
2015/06/19 职场文书
2015年大学生暑期实习报告
2015/07/13 职场文书
励志正能量20句:送给所有为梦想拼搏的人
2019/11/11 职场文书
Nginx反向代理及负载均衡如何实现(基于linux)
2021/03/31 Servers