JQ、JS相关小知识

任意元素自动点击

$(".editicon").trigger('click')

添加子元素

  • append() - 在被选元素的结尾插入内容
  • prepend() - 在被选元素的开头插入内容
  • after() - 在被选元素之后插入内容
  • before() - 在被选元素之前插入内容

删除、清空子元素

$(".p").empty();    //不会删除自己       //删除内部所有子节点
$(".p").remove();  //会删除自己 //删除当前子节点(绑定的不能用)
$(".p").detach();  //会删除自己 //删除当前子节点(绑定的能用)

获取图片的src属性值

var demoJQ = $('#demo');
demoJQ.attr('src')
or
demoJQ[0].src

延迟执行

setTimeout(function(){
console.log("延迟600ms 执行");
},600);

定时执行

setInterval(function(){
console.log("600ms执行一次");
}, 600)

JS打开新标签页

window.open("http://www.wlzhys.com", "_blank"); //注意第二个参数

判断字符串中是否包含某个字符串

方法一:indexOf()

indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。如果要检索的字符串值没有出现,则该方法返回 -1。

var str = "123";
console.log(str.indexOf("3") != -1 ); // true

方法二:search()

search() 方法用于检索字符串中指定的子字符串,或检索与正则表达式相匹配的子字符串。如果没有找到任何匹配的子串,则返回 -1。

var str = "123";
console.log(str.search("3") != -1 ); // true

方法三:match()

match() 方法可在字符串内检索指定的值,或找到一个或多个正则表达式的匹配。

var str = "123";
var reg = RegExp(/3/);
if(str.match(reg)){
// 包含
}

页面加载完后执行JS的方式

方式一:js自带方法

<script type="text/javascript">
window.onload = function () {
//方法内容
}
</script>

方式二:jq常用方式

<script type="text/javascript">
$(function () {
alter("123qew");
})
</script>

获取当前页面URL

url = window.location.href; /* 获取完整URL */
/* http://127.0.0.1:8020/Test/index.html#test?name=test */ url = window.location.pathname; /* 获取文件路径(文件地址) */
/* /Test/index.html */ url = window.location.protocol; /* 获取协议 */
/* http */ url = window.location.host; /* 获取主机地址和端口号 */
/* http://127.0.0.1:8020/ */ url = window.location.hostname; /* 获取主机地址 */
/* http://127.0.0.1/ */ url = window.location.port; /* 获取端口号 */
/* 8020 */ url = window.location.hash; /* 获取锚点(“#”后面的分段) */
/* #test?name=test */ url = window.location.search; /* 获取属性(“?”后面的分段) */
 

自定义博客cnblogs样式的必备前端小知识——js、jq的更多相关文章

  1. 自定义博客cnblogs样式的必备前端小知识——css

    css样式相关小知识 文字超出一行显示省略号 overflow: hidden; /*自动隐藏文字*/ text-overflow: ellipsis; /*文字隐藏后添加省略号*/ white-sp ...

  2. 前端小知识-js

    一.对象冒充 function student(name,age){ this.name = name; this.age = age; this.show = function(){ console ...

  3. 【转】CnBlogs自定义博客样式

    文章有一个好的排版,将能够增加阅读者对其内容的兴趣. 本文总结了如何美化博客园中文章的部分显示样式. 1.美化文章标题的显示样式 2.增添LaTex数学公式的显示 3.目录索引的显示 4.添加文章末尾 ...

  4. CnBlogs自定义博客样式

    弄了半个晚上的时间,总算马马虎虎搞好了博客的样式. 整个博客是蓝色的基调,比较激情,我喜欢. 比较郁闷的是,rightmenu 和 main都是position:absolute 布局的.要添加一个f ...

  5. web前端/移动端H5博客专家博客大全--值得收藏的前端技术大牛博客地址

    web前端/移动端H5博客专家博客大全--值得收藏的前端技术大牛博客地址   Huang Jie Blog .Com-前端开发 http://www.huangjieblog.com/?feed=rs ...

  6. 【技术博客】基于vue的前端快速开发(工具篇)

    一.Vue教程 vue.js是一套构建用户界面的渐进式框架.vue采用自底向上增量开发的设计.vue的核心库只关心视图层,非常容易学习,非常容易与其它库和已有项目整合.vue完全有能力驱动采用单文件组 ...

  7. 博客CSS样式 二

    预览 可自行更改颜色 背景图 页面定制 CSS 代码中加入: url为背景图地址,可下载心仪背景图后上传到博客园相册后获取地址 body { color: #000; background: url( ...

  8. Chrome 插件自定义博客编辑界面

    总觉得博客园的编辑器太白了,特别是在晚上,太明亮了刺眼.在后台设置里面找不到任何可以修改UI的地方,考虑用浏览器插件自己改一下.要是做得好,可以给大家一起用. 新建目录 E:/cnblog.js,添加 ...

  9. vue koa2 mongodb 从零开始做个人博客(一) 登录注册功能前端部分

    0.效果演示 插入视频插不进来,就很烦.可以出门右拐去优酷看下(点我!). 1.准备工作 1.1前端框架 前端使用了基于vue.js的nuxt.js.为什么使用nuxt.js? 首先我做的是博客的项目 ...

随机推荐

  1. There is no PasswordEncoder mapped for the id "null"的解决办法

    今日在SpringBoot项目中使用 Spring Security ,登录时发现报500错,报错信息如下: There is no PasswordEncoder mapped for the id ...

  2. POJ 2253 Frogger(SPFA运用)

    Description Freddy Frog is sitting on a stone in the middle of a lake. Suddenly he notices Fiona Fro ...

  3. jQuery 工具类函数-浏览器信息

    在jQuery中,通过$.browser对象可以获取浏览器的名称和版本信息,如$.browser.chrome为true,表示当前为Chrome浏览器,$.browser.mozilla为true,表 ...

  4. UVA - 11475 Extend to Palindrome (后缀数组)

    Your task is, given an integer N, to make a palidrome (word that reads the same when you reverse it) ...

  5. Java中大量if...else语句的消除替代方案

    在我们平时的开发过程中,经常可能会出现大量If else的场景,代码显的很臃肿,非常不优雅.那我们又没有办法处理呢? 针对大量的if嵌套让代码的复杂性增高而且难以维护.本文将介绍多种解决方案. 案例 ...

  6. 云栖大会压轴好戏 阿里云发布视频云V5计划与系列新产品

    9月25 - 27日,2019云栖大会如期召开.在大会最后一天下午,阿里云智能视频云分论坛为今年的云栖大会献上了一场精彩的压轴好戏. 视频云V5计划发布 使能生态合作伙伴 会上,阿里云智能研究员金戈进 ...

  7. 关于在vuejs中动态加载不确定数量和内容的组件的解决方案

    在做一个门户项目的时候,客户要求需要进行私人化定制,每个人进入首页的时候可以自定义首页显示的版块 要在4.50个组件中显示随机N个组件按照每个人选定的顺序排列.需求说完了,接下来说说解决方案: htm ...

  8. 7.13 Python基础语法

    Python基础语法 编码: 默认情况下,Python 3 源码文件以 UTF-8 编码,所有字符串都是 unicode 字符串. 当然你也可以为源码文件指定不同的编码 python2.7中有两个函数 ...

  9. 【题解】BZOJ4241: 历史研究(魔改莫队)

    [题解]BZOJ4241: 历史研究(魔改莫队) 真的是好题啊 题意 给你一个序列和很多组询问(可以离线),问你这个区间中\(\max\){元素出现个数\(\times\)元素权值} IOI国历史研究 ...

  10. $BZOJ$2818 $gcd$ 莫比乌斯反演/欧拉函数

    正解:莫比乌斯反演/欧拉函数 解题报告: 传送门$QwQ$ 一步非常显然的变形,原式=$\sum_{d=1,d\in prim}^{n}\sum_{i=1}^{n}\sum_{j=1}^{n}[gcd ...