[JavaScript+JQuery]常用的代码

69 阅读1分钟

一、JavaScrip常用的代码封装

1、JavaScript如何实现页面带参跳转,并在另一个页面处理参数

 location.href = `./index.html?id=${$(this).data('id')}`
var search = location.search
var query = search.slice(1, location.search.length)
console.log(search);
var queryArr = query.split('=')
var queryObj = {}
queryObj[queryArr[0]] = queryArr[1]

2、定时器

var time = setInterval(func, 1000 * n);
function func(){
//代码块
}
clearInterval(time)

3、页面刷新

location.reload()

四、Jquery常用的代码

1、鼠标的移入移出触发事件

    // 鼠标移入触发
      $(".banner").mouseover(function () {
        //代码块
      });
      // 鼠标移除触发
      $(".banner").mouseout(function () {
        //代码块
      });

2、添加和移除css样式

$(".demo").removeClass("className");
$(".demo").addClass("className");
$(".demo").css({
          transform: `translateX(-${1200 * index}px)`,
        });

3、获取节点

//获取某个节点
$(".demoList").eq(n)
//获取demo节点以外兄弟节点
$(".demo").siblings()

4、设置节点属性

$(".demo").data("id", id);

5、节点的增删

let s="111"
$(".demo").append(`<div>${s}</div>`)

6、节点内容

$(".demo").text()
$(selector).val("")

8、点击事件

$('.demo').click(function () {
        //代码块
    })
    
  $('.falther').on('click', '.child', function () {
  //代码块
    })

7、cookie

$.cookie('token')
$.cookie('token', res.token)

8、实现节点的显示和隐藏

/**
 * 切换弹窗的显示和隐藏
 * @param {*} selector 要控制的元素
 * @param {*} visible  是否显示
 */
//登录对话框
function showDialog(selector, visible) {
    if (visible) {
        $(selector).show()
    } else {
        $(selector).hide()
    }   
}