关于Jvav、JQuery

JavaScript和jQuery的认识

javaSript是一门编程语言，jquery是javaSript中的一个库，jquery是JavaScript中的一个子集，

也就是说jquery是javaSript的一部分，jQuery的封装，给我们带来方便的操作，提高了开发的效率性。

获取对象

Js:

通过js方法获取的元素叫做js对象

Var div = document . getElementsByTagName(“div”);

Var box=document . getElementsByClassName(“box”);

Var mode=document . getElementById(“mode”);

jQuery:

通过jQuery方法获取的元素叫做jQuery对象

Var div1 = $(“div”);

Var box1 = $(“box”);

Var mode1 = $(“#mode”);

总结：以上可以的得出jQuery是一个框架，它对JS进行了一个封装，

使得更加方便，要是说JS是父亲的话，那么jquery是儿子。

添加属性和移除属性

Js:

Var box = document . getElementById(“mode”);

添加class属性与属性值

box setAttribute(“class”,”wrapper”);

获取box元素的class的属性值

Var str = box.getAttribute(“class”);

Console.log(str);控制台输出属性值

js移除属性

box .removeAttribute(“id”);

box .removeAttribute(“class”);

jQuery:

$(#box).attr(“index”,”befol”);

获取box元素的index的属性值

Var index = $(“#Box”).attr(“index”);

Console.log(index);控制台输出属性值

jQuery移除属性

#(“#box”).removeAttr(“index”);

添加样式

Html <div id="height">div标签</div>

Js:

window.onload = function () {

var box = document.getElementById("height");

height.style.width = "150px";

height.style.height="150px";

height.style.backgroundColor = "red";

height.style.color = "#fff";

height.style.fontSize = "26px";

}

jQuery:

$(function(){ //简写的jQuery加载事件

$(“#box”).css({width:”150px”,height:”150px”,backgroundColor:”red”,color:”#fff”,fontSize:”30px”,});

});

jQuery的加载事件 $(document).ready(function(){ });

以上的样式设置得：

(innerText、innerHTML)的讲解

Js:

Window.onload = function(){

Var lethe = document.getElementById(“lethe”);

lethe.innerText=’<a href=”#”>可以追加文本</a>’

Var lethee = document.getElementById(“lethee”);

lethee.innerHTML = ’<a href=”#”>可以追加一个标签</a>’

}

jQuery:

$(“#lethe”).html(‘<a href=”#”>可以追加文本</a>’)

Var lethe = $(“#lethe”).html();可传入参数

Console.log(lethe);在控制台输出 html

$(“#lethee”).text(“<a href=”#”>可以追加一个标签</a>”);

$(“#lethee”).text();可传入参数 text

input的讲解

<input type=”text”name=”name” value=””/>文本框

<input type=”checkbox”name=”name” value=””/>复选框

<input type=”radio”name=”name” value=””/>单选框

<input type=”color”name=”name” value=””/>颜色框

<input type=”unmber”name=”name” value=””/>数学框

<input type=”button”name=”name” value=””/>按钮

val();

Document.getElementsByTagName(“input”)[0].value;

$(“input”).val(“1234567890”);

$(“input”).val();可传入参数

Js、jQuery的转换

js对象转为jQuery对象：$(js对象);

js对象要使用jQuery里面的方法就需要将js对象转换为jQuery对象

jQuery转为js对象 : div.get(0);

jquery对象要使用js里面的方法就需要将jQuery对象转换为js对象

jQuery绑定的点击事件

js:

window.οnlοad=function(){

var letai = document.getElementById("box");

letai . οnclick=function(){

var modal = document . getElementById("letai ");

modal.style.display="block";

}

}

jQuery :

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

$("#box").toggleClass("wrapper"); 如果存在（不存在）就删除（添加）一个类。

var lemove = $("#box").hasClass("wrapper"); 检查当前的元素是否含有某个特定的类，如果有，则返回true,没有返回false。

console.log(lemove);

})

关于Jvav、JQuery相关推荐

自学Java day41 图书管理系统-springboot快速开发从jvav到架构师
前端:html + css + jvavscript + vue + ajax + axios + element ui 后端:jvav + springboot + mybatisplus + my ...
Ajax接收Java异常_java – 处理来自Servlet的Jquery AJAX响应中的异常
我的servlet代码是 try{ //something response.setStatus(201); out.print("Data successfully saved" ...
Jquery DIV滚动至浏览器顶部后固定不动代码
获取元素(这里定位元素A)距离顶部的高度,接着设定scroll滚动的事件,比如超过那个高度,把A的位置设定为fixed,小于该高度,修改回relative. 效果例1 代码如下复制代码 <scr ...
jquery.raty评星插件
<!DOCTYPE html> <html><head><meta charset="utf-8" /><title>j ...
jquery autocomplete demo
根据用户输入值进行搜索和过滤,让用户快速找到并从预设值列表中选择. jquery.autocomplete参考地址 http://bassistance.de/jquery-plugins/jquer ...
在Ant-design-pro框架中引入jQuery和jQuery-ui步骤
1.安装jQuery和jQuery-ui npm i jquery s npm i jquery-ui s yarn install 2.在vue.config.js中进行配置 // webpack ...
火狐浏览器允许ajax,解决火狐浏览器发送jquery的ajax请求无效的问题
今天遇到这样一个问题: 页面在chrome下发送ajax的请求是没有问题的,但是在firfox下无效. 代码大致如下: //前面省略 ..... 生成成绩查询成绩 ...... ...... fun ...
jquery 监听的案例
jQuery 简介 jQuery 是一个 JavaScript 库. jQuery 使用可以下载一个,也可以使用Staticfile CDN.百度.又拍云.新浪.谷歌和微软的服务器都存有 jQuer ...
网站项目必备——12款白富美型 jQuery 图片轮播插件
转自:http://www.cnblogs.com/lhb25/archive/2013/01/06/jquery-image-carousel-effect.html 图片轮播是网站中的常用功能,用 ...

关于Jvav、JQuery

关于Jvav、JQuery

目录

JavaScript和jQuery的认识

获取对象

添加属性和移除属性

添加样式

以上的样式设置得：

(innerText、innerHTML)的讲解

input的讲解

Js、jQuery的转换

jQuery绑定的点击事件

关于Jvav、JQuery相关推荐

最新文章

热门文章