Jquery 使用

最新推荐文章于 2024-08-19 21:21:31 发布

咸鱼(已沉底)

最新推荐文章于 2024-08-19 21:21:31 发布

阅读量330

点赞数

本文链接：https://blog.csdn.net/SheeranX/article/details/70477245

版权

1.链式调用：Jquery 的所有方法都返回一个Jquery对象，里面封装了原生的DOM元素。这种封装允许链式调用

例：

<div class="normal">
     <p>Hello World</p>
      <div>
           <span>welcome</span>
      </div>
</div>

JQuery 代码：“>”表示父子关系，可以据此来过滤别的元素

$(".normal>span")
    .contains("welcome")//筛选出包含特定文本的元素。注：如果有多个Span ,在没有ID 和Class 的情况下，就可以通过识别内容来进行区分
    .text("...")
    .css({color:"red"});

tips:$(function()告诉浏览器在加载DOM的时候附加事件处理函数，DOM树是从上到下加载的，只要DOM树加载完脚本，样式和其他资源，浏览器就会出发Window.onload()

事件。$()会监听这个事件并执行附加的事件处理函数。在实际应用时可能会出现只有在页面刷新后方法才被调用的情况，可以通过window.onload()解决。

2.DOM 操作：一些常用的DOM操作

$("#id").css("color":"red");// 改变CSS

var width = $("#id").width();// 得到元素的宽，加参数就是给元素赋值。

$("#div").append("<p>hello code</p>") 结果为：

<div>

<p>hello code</p>

<div>

删除元素：$("#id").remove();

删除样式：$("#id").addClass("css");

添加样式：$("#id").removeClass("css");

获得Input 值：$("input").val();

获得标签内文本：$("p").text();

类似的：.html() .innerhtml()

.prepend() : 插入到匹配元素的头部

.before() : 插入到匹配元素之前

.after(): 插入到匹配元素之后

关注