您的位置：首页 > Web前端 > JQuery

jQuery操作得到DOM元素

2017-05-19 20:47 288 查看

jQuery再DOM操作方面提供了一些函数及其用法，这里就对DOM元素的包装简单说明一下，怎样使用会了，对其它方法也能灵活的使用。以下是一个小样例及其效果图。

代码例如以下：

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>演示jquery操作得到的元素</title>
<%--引入jquery文件--%>
<script  type ="text/javascript" src ="jquery-2.1.4.js"></script>
<script  type ="text/javascript">
$(document).ready(function () {
//触发onclick事件
$("#testbutton").click(
function () {
//使用class为test的元素包裹给定元素
$("p").wrap($(".test"));
}
);
});
</script>
<%--基本样式设定--%>
<style type ="text/css">
.test {
color :white ;
background-color :#ffd800;
}
.wrap {
background-color :green ;
}
</style>
</head>
<body>
<form id="form1" runat="server">

<div id="content">
<button id="testbutton">測试</button>
<br /><br />
<div class ="test"></div>
<p id ="first">第一段文字，id为first</p>
<p id ="second">第二段文字。id为second</p>
<p id ="third">第三段文字，id为third</p>
</div>
</form>
</body>
</html>

对于jQuery的使用自己要多多实践，这样才干对它了如指掌啊~

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航