js和jquery对dom节点的操作(创建/追加)

 更新时间:2013年04月21日 17:12:57   作者:  
本文详细介绍下js和jquery对dom节点的操作包括创建、追加等等,感兴趣的朋友可以参考下哈,希望对你有所帮助
复制代码 代码如下:

<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多文件混淆加密

    JavaScript 代码多文件混淆加密可以有效保护源代码不被他人轻易盗取,这篇文章主要为大家介绍了JavaScript中混淆加密的实现,需要的小伙伴可以参考下
    2023-11-11
  •  JavaScript 数据结构之散列表的创建(1)

     JavaScript 数据结构之散列表的创建(1)

    这篇文章主要介绍了 JavaScript 数据结构之散列表的创建,文章围绕主题相关内容展开详细的介绍,需要的小伙伴可以参考一下
    2022-04-04
  • 微信小程序手动添加收货地址省市区联动

    微信小程序手动添加收货地址省市区联动

    这篇文章主要为大家详细介绍了微信小程序手动添加收货地址省市区联动,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-05-05
  • 如何更好的编写js async函数

    如何更好的编写js async函数

    本文给大家谈一下如何优化async代码,更充分的利用异步事件流杜绝滥用async,感兴趣的朋友跟随脚本之家小编一起学习吧
    2018-05-05
  • addEventListener()与removeEventListener()解析

    addEventListener()与removeEventListener()解析

    这篇文章主要为大家详细介绍了addEventListener()与removeEventListener(),用于处理指定和删除事件处理程序操作,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-04-04
  • 关于微信小程序获取小程序码并接受buffer流保存为图片的方法

    关于微信小程序获取小程序码并接受buffer流保存为图片的方法

    这篇文章主要介绍了关于微信小程序获取小程序码并接受buffer流保存为图片的方法,文中通过示例代码介绍的非常详细,对大家学习或者使用小程序具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧<BR>
    2019-06-06
  • JavaScript Math对象和调试程序的方法分析

    JavaScript Math对象和调试程序的方法分析

    这篇文章主要介绍了JavaScript Math对象和调试程序的方法,结合实例形式分析了javascript中Math对象生成随机数以及使用alert()、console.log()函数进行错误调试相关操作技巧,需要的朋友可以参考下
    2019-05-05
  • 微信小程序自定义导航的方法

    微信小程序自定义导航的方法

    这篇文章主要为大家详细介绍了微信小程序自定义导航的方法,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-08-08
  • javascript实现的闭包简单实例

    javascript实现的闭包简单实例

    这篇文章主要介绍了javascript实现的闭包简单实现方法,涉及javascript闭包的原理与实现技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-07-07
  • 微信小程序记住密码的功能简单几步实现

    微信小程序记住密码的功能简单几步实现

    软件中的“记住密码”选框不知道大家平时会不会勾选,反正对于一个重度懒癌患者的我来说就没有不勾选的时候,毕竟隔一段时间就重新输入一遍难记又难输的账号密码,想想就让人头皮发麻。今天教大家用代码在微信小程序中实现这个简单的小功能
    2023-01-01

最新评论