<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>选取带有 href 属性的元素例子</title>
</head>
<body>
<h2>这是标题</h2>
<p>这是一个段落。</p>
<p>这是另外一个段落。</p>
<p><a href="http://onestopweb.cn">HTML 教程</a></p>
<p><a href="http://onestopweb.iteye.com">CSS 教程</a></p>
<button>点我</button>
<script src="jquery-1.10.1.min.js"></script>
<script>
$(function(){
$("button").click(function(){
$("[href]").hide();
});
});
</script>
</body>
</html>
效果图：
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>选取所有 target 属性值等于 "_blank" 的 <a> 元素例子</title>
</head>
<body>
<h2>这是标题</h2>
<p>这是一个段落。</p>
<p>这是另外一个段落。</p>
<p><a href="http://onestopweb.cn">HTML 教程</a></p>
<p><a href="http://onestopweb.iteye.com" target="_blank">CSS 教程</a></p>
<button>点我</button>
<script src="jquery-1.10.1.min.js"></script>
<script>
$(function(){
$("button").click(function(){
$("a[target='_blank']").hide();
});
});
</script>
</body>
</html>
效果图：
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>选取所有 target 属性值不等于 "_blank" 的 <a> 元素例子</title>
</head>
<body>
<h2>这是标题</h2>
<p>这是一个段落。</p>
<p>这是另外一个段落。</p>
<p><a href="http://onestopweb.cn">HTML 教程</a></p>
<p><a href="http://onestopweb.iteye.com" target="_blank">CSS 教程</a></p>
<button>点我</button>
<script src="jquery-1.10.1.min.js"></script>
<script>
$(function(){
$("button").click(function(){
$("a[target!='_blank']").hide();
});
});
</script>
</body>
</html>
效果图：
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>选取所有 type="button" 的 <input> 元素 和 <button> 元素例子</title>
</head>
<body>
<h2>这是标题</h2>
<p>这是一个段落。</p>
<p>这是另外一个段落。</p>
<p><a href="http://onestopweb.cn">HTML 教程</a></p>
<p><a href="http://onestopweb.iteye.com" target="_blank">CSS 教程</a></p>
<button>点我</button>
<script src="jquery-1.10.1.min.js"></script>
<script>
$(function(){
$("button").click(function(){
$(":button").hide();
});
});
</script>
</body>
</html>
效果图：
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>选取偶数位置的 <tr> 元素例子</title>
</head>
<body>
<table border="1">
<tr>
<th>网站名</th>
<th>网址</th>
</tr>
<tr>
<td>Google</td>
<td>http://www.google.com</td>
</tr>
<tr>
<td>Baidu</td>
<td>http://www.baidu.com</td>
</tr>
<tr>
<td>淘宝</td>
<td>http://www.taobao.com</td>
</tr>
<tr>
<td>Facebook</td>
<td>http://www.facebook.com</td>
</tr>
</table>
<script src="jquery-1.10.1.min.js"></script>
<script>
$(function() {
$("tr:even").css("background-color","yellow");
});
</script>
</body>
</html>
效果图：
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>选取奇数位置的 <tr> 元素例子</title>
</head>
<body>
<table border="1">
<tr>
<th>网站名</th>
<th>网址</th>
</tr>
<tr>
<td>Google</td>
<td>http://www.google.com</td>
</tr>
<tr>
<td>Baidu</td>
<td>http://www.baidu.com</td>
</tr>
<tr>
<td>淘宝</td>
<td>http://www.taobao.com</td>
</tr>
<tr>
<td>Facebook</td>
<td>http://www.facebook.com</td>
</tr>
</table>
<script src="jquery-1.10.1.min.js"></script>
<script>
$(function() {
$("tr:odd").css("background-color","yellow");
});
</script>
</body>
</html>
效果图：