jQuery,二

我们通过Jquery选取html的元素,执行一些动作。

基础语法:

$(selector).action()

selector是你要“查询”和“查找”的html元素

而action()是你要对元素执行的操作

$(this).hide() 使用这个函数,可以隐藏当前的html元素,

$("#btn").hide() 使用这个函数,会隐藏元素中id为btn的元素

$(".btn").hide()使用这个函数,会隐藏元素中class为btn的元素

$("p").hide()使用这个函数,会隐藏<p>元素

<%@ page language="java" contentType="text/html; charset=utf-8"

pageEncoding="utf-8"%>

<!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>Insert title here</title>

<script type="text/javascript" src="js/jquery.min.js"></script>

</head>

<body>

<p>n我是一个小菜鸟</p>

<p class="p1">class点击</p>

<p >id点击</button>

<script type="text/javascript">

$(document).ready(function() {

$(this).hide();

$("#btn").click(function() {

$("p").hide();

$("#p2").hide();

$(".p1").hide();

$(this).hide();

});

});

</script>

</body>

</html>

当然还有别的选择html元素的方法:

$(".heihei")选取所有属性class=“heihei”的元素

$("#heihei")选取所有属性id=“heihei”的元素

$("p.heihei") 选取所有<p>标签class属性为heihei的元素

$("p#heihei")选取所有<p>标签id属性为heihei的元素

$("[type]") 选取所有带有type属性的元素

$("[type="text]")选取所有带type属性并且type属性为text的元素

$("[type!="text]")选取所有带type属性并且type属性不为text的元素

$("[href$=".jpg"]")选择带href属性的元素,并且值结尾为.jpg元素的属性

$("ul li:first")选取每个<ul>的第一个<li>元素

实例:

$(document).ready(function() {

$(this).hide();

$("#btn").click(function() {

$("p").css("background-color","red");

});

});