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

jQuery基础----12jQuery HTML-设置

2015-08-16 14:54 711 查看
<!DOCTYPE html>
<!--jQuery HTML-设置-->
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script src="jquery-2.1.4.min.js"></script>
<script src="js12.js"></script>
</head>
<body>
<p id="pid1">吾生也有涯1</p>
<p id="pid2">吾生也有涯2</p>
<input type="text" value="hello" id="myshurukaung01">
<br/>
<a href="http://www.baidu.com" id="aid01">中国最牛的搜索引擎</a>
<br/>
<button id="btn1">按钮1</button>
<br/>
<button id="btn2">按钮2</button>
<br/>
<button id="btn3">按钮3</button>
<br/>
<button id="btn4">按钮4</button>
<br/>
<p id="pid5">callback</p>
<button id="btn5">按钮5</button>

</body>
</html>
js:

/**
* Created by hao on 2015/8/15.
*/
$(document).ready(function(){
$("#btn1").click(function(){
//修改p元素中的内容
$("#pid1").text("庄子很牛逼");
});
$("#btn2").click(function(){
//吧p元素改成a元素
$("#pid2").html("<a href='http://www.baidu.com'>伟大的百度</a>");
});
$("#btn3").click(function(){
//改变输入框中的文字
$("#myshurukaung01").val("中国人");
});
$("#btn4").click(function(){
//改变输入框中的文字
$("#aid01").attr({
"href":"http://www.jikexueyuan.com/path/html5/",
"title":"hello world"
});
});
$("#btn5").click(function(){
$("#pid5").text(function(i,ot){
return "old"+ot+"新内容"+(i);
});

})

})
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: