jQuery

最新推荐文章于 2024-11-04 16:22:37 发布

原创最新推荐文章于 2024-11-04 16:22:37 发布 · 189 阅读

0 ·

CC 4.0 BY-SA版权

python3 专栏收录该内容

55 篇文章

订阅专栏

jQuery语法是通过选取HTML元素，并对选取的元素执行某些操作

基础语法：$(selector).action()

$ 符号定义jQuery

选择符（selector）查询和查找HTML元素

jQuery的action()执行对元素的操作

实例：

$(this).hide() 隐藏当前元素

$("p").hide() 隐藏所有<p>元素

$("p.text").hide() 隐藏所有class=”test“的<p>元素

$("#test").hide() 隐藏所有id=“test”的元素

=====

jQuery入口函数

$(document).ready(function(){

//执行代码

})；

或者

$(function(){

//执行代码

})；

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>jquery元素简单元素选择操作 </title> 
<script src="https://cdn.bootcss.com/jquery/2.0.0/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("button#test1").click(function(){
    $("p").hide();
  });
});
</script>
<script>
$(function(){
	$("button#test2").click(function(){
	$("input#test").val("python selenium execute script");
  });
});
</script>
<script>
$(document).ready(function(){
  $("button[name='test4'").click(function(){
  alert($("h1").text());
  });
});
</script>
<script> 
$(function(){
	$("button.test3").click(function(){
	$("p").show();
	});
});
</script>
</head>
<body>
<h1 title="苹果">苹果呵呵哒</h1>
<li title="橘子">橘子</li>
<li title="菠萝">菠萝</li>
<li title="菠萝2">菠萝2</li>
<li title="菠萝3">菠萝3</li>
<h2>这是一个标题</h2>
<p>这是一个段落。</p>
<p>这是另一个段落。</p>
<button id="test1">消失</button>
<input tpye="text" id="test"></input>
<button id="test2">点击输入的信息</button>
<button class="test3">呈现</button>
<button name="test4">弹窗</button>
</body>
</html>