前端--边用边查边学边记录

最新推荐文章于 2024-10-10 12:12:28 发布

Jia喵

最新推荐文章于 2024-10-10 12:12:28 发布

阅读量81

点赞数

本文链接：https://blog.csdn.net/hduzjn/article/details/100741390

版权

来自教程
 来自教程

jQuery

$(selector).action()

选择器 $().action

基本选择器

元素选择器 标签类型

$("p")
$("h1")
$("span")

类选择器 .class

<h1 class="center">标题居中</h1>
$(".center")

id选择器 #

$("#id")

其他选择器

后代选择器 $()

//$().find() 
//$().children() 
//-------------
<table id="tb">
        <tr>
            <td>0</td>
            <td>1</td>
            <td>2</td>
        </tr>
        <tr>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
 </table>

$("#tb").children("tr:eq(1) td:eq(1)").html()//null
//遍历一级到达<tr><tr/>
$("#tb").find("tr:eq(1) td:eq(1)").html()//4

兄弟选择器

$().siblings()
$().next()
$().nextAll()
$().prev()
$().prevAll()

   //选中name属性是password2的input标签后面的的所有span兄弟标签，设置文本内容
   $("input[name='password2']").nextAll("span").text("两次密码不一致");

事件

通常会把 jQuery 代码放到 < head >部分的事件处理方法中

点击事件 click

与标签之间的所有内容都是按钮的内容，其中包括任何可接受的正文内容，比如文本或多媒体内容。

//type button /reset /  submit
<html>
<body>
<button type="button">点我</button>
</body>
</html>

$("button").click(function(){
    $("p").hide();
 });

函数	事件描述
$().click(function)	点击事件
$().dblclick(function)	双击事件
$().focus(function)	鼠标聚焦事件
$().blur(function)	鼠标离开事件
$().mouseover(function)	鼠标悬停事件

效果

show
hidden
toggle 在以上两者之前切换

$("button").click(function(){
  $("p").toggle();
});

其他

text 返回或设置被选元素的值。

$(document).ready(function(){
	$("button").click(function(){
		$("p").text("Hello world!");
});

val 返回或设置被选元素的值，元素的值是通过 value 属性设置的。该方法大多用于 input 元素。

$("button").click(function(){
$(":text").val("Hello World");
});

JS

对象—在 JavaScript 中，几乎“所有事物”都是对象。

对象定义—超级随便自由度太高了吧~~~~

var person = "Bill Gates";
var person = {firstName:"Bill", lastName:"Gates", age:62, eyeColor:"blue"};

ar person = new Object();
person.firstName = "Bill";
person.lastName = "Gates";
person.age = 50;
person.eyeColor = "blue";

对象方法

//methodName : function() { 代码行 } 键值对
//objectName.methodName() 访问对象方法
var person = {
  firstName: "Bill",
  lastName : "Gates",
  id       : 648,
  FunctionName : function() {
    return this.firstName + " " + this.lastName;
  }
};