jq 方法

val方法:
<input type="text" value="洋酒" id="txt"/>
<script src="jquery-1.12.4.js"></script>
<script>
$(function () {
$("#txt").focus(function () {
//如果是默认值,清空内容
if($(this).val()==="洋酒"){
$(this).val("");
}
});
$("#txt").blur(function () {
if($(this).val()===""){
$(this).val("洋酒");
}
});
});
</script>



html方法与text方法:
<div><h3>我是标题</h3></div>
<script src="jquery-1.12.4.js"></script>
<script>
$(function () {
// console.log($("div").html());// <h3>我是标题</h3>
// console.log($("div").text());//我是标题

// $("div").html("<p>我是文本</p>");//显示屏:我是文本
$("div").text("<p>我是文本</p>");//显示屏:<p>我是文本</p>
});
</script>




width和height方法:
<style>
div{
width: 200px;
height: 200px;
background-color: pink;
}
</style>
</head>
<body>
<div></div>
<script src="jquery-1.12.4.js"></script>
<script>
$(function () {
//获取div的宽度
// console.log($("div").css("width"));
// $("div").css("width","400px")

//直接获取到的是数字
console.log($("div").width());//width
console.log($("div").innerWidth());// padding+width
console.log($("div").outerWidth());// padding+width+border
console.log($("div").outerWidth(true));// padding+width+border+margin
$("div").width(400);//设置宽为400


//需要获取页面可视区的宽度和高度
$(window).resize(function () {
console.log($(window).width());
console.log($(window).height());
});
});
</script>
posted @ 2018-12-11 20:11  lujieting0  阅读(113)  评论(0编辑  收藏  举报