4jquery高级选择器下

<head>
<meta charset="UTF-8">
<title>3.高级选择器2</title>
</head>
<body>
<form id="form1">
<div>用户名: <input type="text" name="userName" value="admin"></div>
<div>姓名: <input type="text" name="realName" value="无名氏"></div>
<div>昵称: <input type="text" name="nickName" value="佚名"></div>
<div>密码: <input type="password" name="password" value="123456"></div>
<div>确认密码: <input type="password" name="password2" value="123456"></div>
<div>关键字: <input type="text" value="我是关键字"></div>
</form>
<hr>
<ul class="ul">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
<li>9</li>
<li>10</li>
</ul>
<hr>
<form id="form2">
<div><input type="text" value="文本框1"></div>
<div><input type="text" value="文本框2"></div>
<div><input type="password" value="密码框1"></div>
<div><input type="password" value="密码框2"></div>
</form>
</body>
<script src="js/jquery-1.8.3.js"></script>
<script>
/* 伪类 */
$("#form2 :text").css("color", "red");
$("#form2 :password").css("color", "blue");

// $(".ul li:first").css("color", "red");
// $(".ul li:last").css("color", "blue");
// $(".ul li:eq(4)").css("color", "yellow");
// $(".ul li:even").css("color", "yellow");
// $(".ul li:odd").css("color", "blue");
// $(".ul li:lt(5)").css("color", "blue");
// $(".ul li:gt(5)").css("color", "yellow");

/* 属性选择器 */
// $("[name]").css("color", "red");
// $("[name='userName']").css("color", "blue");
// $("[name^='password']").css("color", "yellow");
// $("[name$='Name']").css("color", "red");
// $("[name*='r']").css("color", "red");
</script>
posted on 2022-04-16 16:43  小小程序猿level1  阅读(21)  评论(0)    收藏  举报