<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>1</title>
<script type="text/javascript" src="lib/jquery-1.5.2.js"></script>
<style type="text/css">
.red {
background: red;
}
.green {
background: green;
}
</style>
<script type="text/javascript">
// $().ready(function() {
/*
$('div>p').click(function() {
alert("選中");
});
$('ul>li').hover(function() {
$(this).css("background", 'red');
}, function() {
$(this).css("background", 'white');
});
$('ul>li:last').hover(function() {
$(this).addClass('green');
});
$('ul').find('li').each(function(i) {
$(this).html($(this).html() + "Sam" + i);
});
$('li').not(':has("div")').addClass("red");
*/
//? $('li').not('[div]').addClass("red");
//$("li[name]").css("background-color", "#eee");
/*
$("a[href*=google]").hover(function() {
$(this).addClass('green');
});
*/
/*
$('ul').find("li").hover(function() {
var li = $(this).next();
if (li.is(':visible')) {
li.slideUp();
} else {
li.slideDown();
}
});
*/
/*
$('a').hover(function() {
$(this).parent('div').addClass('green');
}, function() {
$(this).parent('div').removeClass('green');
});
*/
//});
$(function() {
//alert("this simple write !");
//code to execute when the DOM is ready
});
</script>
</head>
<body>
<p>one</p>
<div>
<p>two</p>
</div>
<p>three</p>
<ul>
<li>i</li>
<li>like</li>
<li style="display: no">you</li>
<li>ok
<div>this is a div</div></li>
<li name="hi">have a name</li>
</ul>
<div>
<a href="www.google.com">Google</a> <br /> <a href="www.baidu.com">Baidu</a>
<br /> <a href="www.yahoo.com">Yahoo</a> <br />
</div>
</body>
</html><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title></title>
<script type="text/javascript" src="lib/jquery-1.5.2.js"></script>
<script type="text/javascript" src="lib/jquery.tablesorter.js"></script>
<style type="text/css">
.red {
background: red;
}
.green {
background: green;
display: none;
}
.black {
background: black;
}
.yellow {
background: yellow;
}
div {
width: 100px;
height: 100px;
font-size: 30px;
font-family: serif;
}
</style>
<script type="text/javascript">
$(function() {
/*
$('div[name*=div1]').addClass("red").end().toggle(function() {
$('div[class*=yellow]').hide('slow');
}, function() {
$('div[class*=yellow]').show('fast');
});
$('div[name*=div2]').addClass("green");
*/
/*
$("a").toggle(function() {
$("div[name*=div1]").animate({
height : "hide",
opacity : 'hide'
}, "slow");
}, function() {
$("div[name*=div2]").animate({
height : "show",
opacity : 'show'
}, "slow");
});
*/
$('#large').tableSorter({
stripingRowClass : [ 'odd', 'even' ],
stripRowStartUp : true
});
});
</script>
</head>
<body>
<div name="div1" class="red">div1</div>
<div name="div2" class="green">div2</div>
<div class="yellow">div3</div>
<div class="black">div4</div>
<a href="#">toggle</a>
<table id="large" cellspacing="0">
<thead>
<tr>
<th>Email</th>
<th>Id</th>
<th>Phone</th>
<th>Total</th>
<th>Ip</th>
</tr>
</thead>
<tbody>
<tr>
<td>devo@flexomat.com</td>
<td>66672</td>
<td>941-964-8535</td>
<td>$2482.79</td>
<td>172.78.200.124</td>
</tr>
<tr>
<td>1</td>
<td>3</td>
<td>5</td>
<td>9</td>
<td>2</td>
</tr>
</tbody>
</table>
</body>
</html>