前端
张子又
道阻且长,行则将至 行而不辍,未来可期!
展开
-
jQuery属性节点
1.attr属性操作在jQuery中,可以通过attr()方法操作属性,可以是固有属性,也可以是自定义属性。1.1 设置属性值// 设置单个属性$("div").attr("title", "我是一个div");// 设置多个属性$("img").attr({ "src" : "img/11.jpg", "alt" : "我是一张风原创 2019-01-18 21:26:21 · 459 阅读 · 0 评论 -
JS中的函数
函数: 就是可被重复调用执行的代码块。1.函数的定义function 函数名(参数1, 参数2, ... , 参数3) { // 需要执行的代码块 }1、function是一个关键字, 和var、typeof一样, 都是关键字, 后面要加空格;2、函数名的命名规范和变量命名一样, 只能是字母、数字、下划线、美元符号, 不能以数字开头, 一般采用驼峰式命名大;3、函数名后...原创 2019-01-14 20:16:11 · 4472 阅读 · 0 评论 -
JS中的定时器
定时器1. setInterval()循环定时器:周而复始的执行(循环执行),比较常用语法:setInterval(code, millisec)setInterval(fun, 5000);function fun() { console.log("每五秒钟执行一次");}2. setTimeout()炸弹定时器:用完以后立刻报废(只执行一次)语法:setT...原创 2019-01-14 20:23:00 · 863 阅读 · 0 评论 -
3D烟花特效-超级炫酷!
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <meta char原创 2019-01-14 20:57:49 · 11730 阅读 · 42 评论 -
3D文字模型-超级炫酷!
<!DOCTYPE html><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name原创 2019-01-14 21:27:09 · 1302 阅读 · 0 评论 -
可视化音频特效-炫酷!
<!DOCTYPE html><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name原创 2019-01-14 21:28:39 · 2121 阅读 · 0 评论 -
炫酷网状图形
<!DOCTYPE html><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="width=device-width,原创 2019-01-14 21:33:50 · 1120 阅读 · 0 评论 -
超炫酷的粒子麦浪
<!DOCTYPE html><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="width=device-width,原创 2019-01-14 21:36:13 · 471 阅读 · 0 评论 -
JS中的对象
对象JavaScript 提供多个内建对象,比如 Object、String、Date、Array 等等,此外 JavaScript 允许自定义对象。对象只是带有属性和方法的特殊数据类型。1.创建 JavaScript 对象1.1 通过new关键字创建对象var obj = new Object();// 添加属性obj.name = "小明";// 添加方法obj.sleep ...原创 2019-01-15 21:30:45 · 1770 阅读 · 0 评论 -
JS中的Math和Date
Math和Date:1. Math对象round 四舍五入获取整数 console.log(Math.round(-1.5)); // 输出:-1floor 向下取整 地板 console.log(Math.floor(1.8)); // 输出:1 console.log(Math.floor(1.3)); // 输出:1 console.log(Math.floo...原创 2019-01-15 21:35:17 · 335 阅读 · 0 评论 -
JS中的DOM对象
DOM对象1. DOM树当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model),通过 HTML DOM对象,可访问 JavaScript HTML 文档的所有元素。HTML DOM 模型被构造为对象的树。节点(Node):HTML文档中的所有内容都可以称之为节点,包含元素节点、属性节点、文本节点、注释节点和文档节点。文档(Document):就是指H...原创 2019-01-15 21:39:16 · 4961 阅读 · 16 评论 -
JS中的DOM事件
DOM事件1. DOM事件事件三要素:事件源、事件、事件驱动程序☛事件源,也就是需要操作的对象,例如:var box = document.getElementById(“box”);☛事件,例如:onclick、onmouseenter等,例如:box.onclick = function() { 程序 };☛事件驱动程序,就是接下来我们将要要学习的关于DOM的操作,例如:this.i...原创 2019-01-15 21:50:15 · 1000 阅读 · 0 评论 -
JS中的数组
在程序语言中数组的重要性不言而喻,JavaScript中数组也是最常使用的对象之一,数组是一个有序集合,由于弱类型的原因,JavaScript中数组十分灵活、强大,不像是Java等强类型高级语言数组只能存放同一类型或其子类型元素,JavaScript在同一个数组中可以存放多种类型的元素,而且是长度也是可以动态调整的,可以随着数据增加或减少自动对数组长度做更改。1.数组的创建通过字面量来创建数组...原创 2019-01-14 20:10:24 · 253 阅读 · 0 评论 -
JS中的字符串
string字符串是用来存储一系列的字符的集合, 用于存储和处理文本,属于基本数据类型中的一种。1. 字符串的创建通过字面量来创建字符串var str1 = "hello world!";var str2 = 'hello world!';console.log(str1); // 输出:"hello world!"console.log(str2); // 输出:"hello ...原创 2019-01-14 20:05:15 · 387 阅读 · 0 评论 -
jQuery样式操作
1.css() 方法css() 方法返回或设置匹配的元素的一个或多个样式属性。1.1 设置CSS样式// 设置一个属性$("#box").css("background-color", "blue");// 设置多个属性$("#box").css({ "color": "re原创 2019-01-18 21:28:30 · 428 阅读 · 0 评论 -
jQuery节点操作
1.创建节点$(html) 方法会根据传入的HTML标记字符串,创建一个DOM对象,并将这个DOM对象包装成一个jQuery对象后返回。var $title = $("<h1 title='一级标题' class='title'>我是大标题</h1>");var $list = $("<ul class='list'>\ ...原创 2019-01-18 21:35:37 · 284 阅读 · 0 评论 -
jQuery遍历节点
1.jQuery 遍历 - 祖先1.1 parent() 方法parent() 方法返回被选元素的直接父元素。下面的例子返回每个元素的的直接父元素:$(function () { $("span").parent();});加粗样式1.2 parents() 方法parents() 方法返回被选元素的所有祖先元素,它一路向上直到文档的根元素()。下面的例子返回所有 元素...原创 2019-01-18 21:40:15 · 3341 阅读 · 0 评论 -
JS中的DOM内容节点操作
DOM内容节点操作document 对象中有innerHTML和innerText 两个属性, 这两个属性都是获取和修改 document 对象的文本内容。1. innerHTMLinnerHTML - 设置或返回所选元素的内容(包括 HTML 标记)。<body> <p id="txt"></p> <div id="box">...原创 2019-01-18 21:44:37 · 1012 阅读 · 0 评论 -
JS中的DOM属性节点操作
DOM属性节点操作操作属性节点有两种当时,一种是通过普通对象的方式来操作属性节点,另外一种是通过属性节点的方法来操作属性节点。1. 元素节点.属性或元素节点[属性]如果我们可以把元素节点当成普通对象来处理,通过 元素节点.属性 或 元素节点[属性] 的方式来设置属性。注意:设置类 class 只能用 className1.1 获取属性var img = document.getElem...原创 2019-01-18 21:46:15 · 1453 阅读 · 0 评论 -
JS中的DOM样式操作
DOM样式操作1.CSS样式操作我们可以通过 元素节点.style.样式 来设置行内style样式1.1 获取行内样式注意: 只能获取行内样式,样式名采用的是驼峰命名法则。window.onload = function () { var box = document.getElementById("box"); console.log(box.style.backgro...原创 2019-01-18 21:47:54 · 2473 阅读 · 0 评论 -
JS中的DOM元素节点操作
DOM元素节点操作1. DOM访问关系节点的访问关系,是以属性的方式存在的,DOM的节点并不是孤立的,因此可以通过DOM节点之间的相对关系对他们进行访问。1.1 parentNode父节点调用方式就是: 节点.parentNode调用者就是节点,一个节点只有一个父节点。<body> <div class="parent"> <but...原创 2019-01-18 21:50:12 · 384 阅读 · 0 评论 -
JS中的DOM表单操作
DOM表单操作1.value属性value - 设置或返回表单字段的值。<body> 姓名:<input type="text" id="user-name"> <button id="text-btn">设置文本输入框内容</button> <script> //原创 2019-01-18 21:52:04 · 1095 阅读 · 0 评论 -
jQuery练习
城市多选移动案例:&lt;!DOCTYPE html&gt;&lt;html&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;&lt;/title&gt; &lt;st原创 2019-01-19 14:06:59 · 1122 阅读 · 0 评论 -
jQuery动画效果
1. 隐藏和显示show()方法和hide()方法是jQuery中最基本的动画方法。在HTML文档里,为一个元素调用hide()方法,会将该元素的display样式改为“none”。1.1 hide() 和 show()我们可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素:<body> <div style="width: 200px; ...原创 2019-01-19 14:57:07 · 6408 阅读 · 2 评论 -
JS中的弹出框
弹出框1.alert警告框alert(message)的作用是弹出一个提示框或者警告框,纯提示作用。alert(“Hello World!”);因为alert是window对象的函数,也可以通过window.alert()来调用。window.alert(“Hello World!”);2. prompt询问框prompt(text,defaultText)的作用是弹出一个询问框,...原创 2019-01-14 19:55:33 · 1444 阅读 · 0 评论