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

jQuery常用的一些方法

2017-06-28 09:25 351 查看
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>domevent.html</title>

<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">

<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

<style type="text/css">
.myClass{
color:skyblue;
}
</style>

<script type="text/javascript" src="../../jquery-2.2.4.js"></script>
<script type="text/javascript">
/*
jQuery对象常用的一些方法

get(index)获取jQuery对象中的dom对象
eq(index)获取jQuery对象中的jQuery对象

1.jQuery对象修改dom元素的数据(方法中不带参数就是获取数据,带参数就是修改数据)
html( [val | fn] )
text( [val | fn] )
val( [val | fn | arr] )
attr(name)获取指定属性的值
attr(key, value) 设置属性和对象的值

2.jQuery对象修改dom元素的样式
css行内样式
addClass内部样式表
removeClass移除指定的内部样式表
3.修改dom元素的子元素
append追加元素到所有子元素的末端
remove 移除元素,移除的是自己
*/
$(function(){
//alert($("div").eq(2).text());
$("a").eq(0).attr("href","http://www.baidu.com");

$("#myDiv").addClass("myClass");
$("#myDiv").removeClass("myClass");
//$("#myDiv").css("color","red");

var obj=[{
no:"1",
name:"SMITH",
sal:"5000"
},{
no:"2",
name:"SCOTT",
sal:"8000"
},{
no:"3",
name:"TOM",
sal:"15000"
}]

for(var i=0;i<obj.length; i++){
$("#myTable").append("<tr mark=1><td>"+obj[i].no+"</td><td>"+obj[i].name+"</td><td>"+obj[i].sal+"</td></tr>");
}

$("#myBtn").click(function(){
$("tr[mark=1]").remove();
});
})
</script>
</head>

<body>
<div id="myDiv">演示行内样式</div>

<div>1</div>
<div>2</div>
<div>3</div>
<a>跳转到百度</a>

<table id="myTable" border="1" style="border:1px solid black;width:400px">
<tr>
<th>编号</th>
<th>姓名</th>
<th>薪水</th>
</tr>
</table>

<input id="myBtn" type="button" value="删除" />
</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: