jQuery
2021-04-13 13:27
标签:动态获取 click ESS getattr att 属性 面向 获得 fadeout 核心:操作dom(通过面向对象) jq是一种链式操作 。 一种炫酷效果 下拉 一种效果 渐隐渐显 下面是获得自定义属性 data-name 一个独立标签a内部四个标签 要控制另外一个标签b内部对应的四个 a标签内部设置自定义属性内容等于b标签id 点击a拿到自定义属性 操控id
jQuery 标签:动态获取 click ESS getattr att 属性 面向 获得 fadeout 原文地址:https://www.cnblogs.com/-constructor/p/12387294.htmlwrite less do more
$可以拿到dom元素
$(document).ready(function() {
页面加载好执行
})
//等同于
$(function() {
页面加载好执行
})
$(document).ready(function() { $(‘hidden‘).hide(300).show(1000) // 300ms后隐藏 1000ms后显示 })
//等同$(document).ready(function() {
$(‘div‘).toggle(1000).toggle(1000)
})原理:
function $(id) {
return document.getElementById(id)
}
$(id)
$(document).ready(function() {
$(‘hidden‘).slideUp(300).delay(1000延迟).slideDown(1000) // 300ms后上拉 1000ms后下降
})
$(document).ready(function() {
$(‘hidden‘).slideToggle(300) 300ms后上拉 1000ms后下降
})
$(document).ready(function() {
$(‘div‘).fadeToggle(1000).delay(1000).fadeToggle(1000)
})
//等同
$(document).ready(function() {
$(‘div‘).fadeOut(1000).delay(1000).fadeIn(1000)
})
增加css样式
$(‘div‘).css({
color: ‘red‘
})
绑定事件
$(‘div‘).on(‘click‘, () => {
console.log(‘click‘)
})
改变元素内容(可以用css 选择器)
$(‘p‘).on(‘mouseenter‘, () => {
$(‘.div2‘).html(‘hello word boy>‘)
})
$(‘p‘).on(‘mouseenter‘, () => {
$(‘.div2 h1‘).html(‘hello word boy>‘)
}) //$(can use element choies)
一、获取元素的属性
//原声
获取属性 .getAttribute("属性")
//jQuery
获取属性 .attr("属性")
1.2动态获取被点击的button值 //绑定事件回调函数不要用this
$(‘.button‘).on(‘click‘, function (e) {
log($(this))
log(e.target)
})
重点
上一篇:css3