YAOHAIXIAO.COM

HTML(5),CSS(3),JavaScript,DOM,Ajax,JSON,Front-end technologies & Yaohaixiao

热门标签:JavaScript Performance 前端开发 前端性能优化 原创

Rss

Home » Page 7

将文本中URL地址替换为可以点击的链接的处理办法

很久没有写文章了,这几天在写一个小程序的时候,需要用到正则表达式匹配用户输入文本中的URL地址,然后将URL地址替换成可以点击的链接。URL地址的匹配,我想这应该是大家在做验证处理中常会用到的,这里就把我整合的一个比较完整的表达式给出来: var URL = /(https?:\/\/|ftps?:\/\/)?((\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3})(:[0-9]+)?|(localhost)(:[0-9]+)?|([\w]+\.)(\S+)(\w{2,4})(:[0-9]+)?)(\/?([\w#!:.?+=&%@!\-\/]+))?/ig; 这个表达式可以匹配 http,https,f… [阅读全文]

jQuery 1.9.1 的改变,没有了 $.browser 转而使用 $.support

jQuery 1.9.1 的改变,没有了 $.browser 转而使用 $.support

这两天看到 jQuery 升级到了 1.9.1 于是把自己网站的 jQuery 也升级了。但是发现以前的 $.browser 属性没有了。原来新的 jQuery 1.9.1 不再支持这个方法了。转而推荐使用 $.support。引用 jQuery 官方网站的说法: Rather than using $.browser to detect the current user agent and alter the page presentation based on which browser is running, it is a good practice to use feature detection. To make thi… [阅读全文]

Infinite Scroll & Masonry–jQuery 瀑布流布局插件实例

Infinite Scroll & Masonry–jQuery 瀑布流布局插件实例

程序简介: Infinite Scroll & Masonry是两个非常不错的 jQuery 插件,利用这两个插件我们就可以很容易的实现时下流行的瀑布流布局。作为商品展示和图片分享展示,这个效果是再合适不过了。看看效果吧: // 调用代码 (function(){ function item_masonry(){ $(‘.item img’).load(function(){ $(‘.infinite_scroll’).masonry({ itemSelector: ‘.masonry_brick’, columnWidth: 226, gutterWidth: 15 }); }); $(‘.infinite_scroll… [阅读全文]

给 WordPress 添加数字分页导航

给 WordPress 添加数字分页导航

制作 BlueNight 主题的工程中积累一些 WordPress 的开发经验,今天这里就把如何给 WordPress 添加数字分页导航的 PHP 代码给出: <?php /** * Paginate */ if (!function_exists(‘paginate’)): function paginate($args = null) { // 显示数字当行个数的范围基数:默认值 = 3 $range_gap = 3; // 主题设置的值,如果你不是使用的 BlueNight 主题,那么有 $range_gap = 3; 就OK了 if (get_option(‘bluenight_paginate_num’) != ”… [阅读全文]

利用 explode() 函数获得 WordPress 中第一段的内容

利用 explode() 函数获得 WordPress 中第一段的内容

如何获得 WordPress 中第一段的内容?我想很多用 WordPress 的朋友都会考虑这个问题。比如我们在文章列表页希望使用第一段的内容生成文章的摘要。我这里就给出我的一个解决方案: if (!function_exists(‘get_the_paragraph’)): function get_the_paragraph($nth){ $content = get_the_content(); $content = apply_filters(‘the_content’, $content); $content = str_replace(‘]]>’, ‘]]&gt;’, $content); $paragra… [阅读全文]

制作 WordPress 主题时需要添加默认标题

制作 WordPress 主题时需要添加默认标题

昨天收到了 WordPress Theme 测试组给我回复了,很遗憾 BlueNight 1.1.28 测试没有通过。这里把我遇到的一个反馈的信息给大家展示一下: No Post Title: This Post has no Post Title, but must still display a link to the single-page Post view. 原来,在用户没有输入文章标题的时候,WordPress 也要有一个默认的标题显示出来,以便浏览者可以点击链接文字到这个无标题的详细页。唉!没有标题要给个默认标题,我们只用使用:add_filter(‘the_title’, ‘default_title’); 这样来改… [阅读全文]

利用 query_posts() 函数实现 WordPress 按不同类别显示不同条数的文章

利用 query_posts() 函数实现 WordPress 按不同类别显示不同条数的文章

这两天在继续优化 BlueNight 主题,其中一个要优化的地方就是给我的 Video 分类设置不同的页面布局,以区分视频栏目和普通的文章列表页。遇到的一个问题就是希望给 Video 分类的列表页显示不同的文章条数。我想也有其他玩 WordPress 的朋友希望针对不同的分类显示不同的文章条数。这里我就把我的实现方式给大家分享一下。 query_posts() 函数就是我们实现这个功能的关键。query_posts() 函数具体的 API 使用方法我已经给出了访问链接,大家自己查看,我这里就直接介绍相关的内容。 query_posts() 函数简介 query_posts()函数是最简单的用来改变默认的 WordPress 查询的方… [阅读全文]

给 WordPress 在 Chrome 浏览器中添加语音搜索功能

给 WordPress 在 Chrome 浏览器中添加语音搜索功能

为了优化 BlueNight 主题的用户体验,给 BlueNight 主题添加了对 Chrome 浏览器的语音搜索功能。 语音搜索功能对于于老年人、残障人士、偷懒人群是一个非常有用功能。不过这个功能目前只能在 Chrome 11+ 的谷歌浏览器上看到这个效果。例如本博客在 Google 的 Chrome(23.0.1271.97 m) 浏览器中显示的那样: 在 Chrome中实现语音搜索很简单,只需要在 WordPress 的 searchform.php 文件的代码加上 x-webkit-speech 特殊属性就可以轻松搞定: <form method=”get” action=”/” class=”searchform t… [阅读全文]

PHP preg_replace() 函数详解

PHP preg_replace() 函数详解

preg_replace() 函数是用来执行一个正则表达式的搜索和替换的。PHP 4.0 开始支持这个函数。 preg_replace 的语法 mixed preg_replace ( mixed $pattern , mixed $replacement , mixed $subject [, int $limit = -1 [, int &$count ]] ); 函数搜索 subject 中匹配 pattern 的部分, 以 replacement 进行替换。 preg_replace 的参数说明 参数 描述 pattern 要搜索的模式。可以使一个字符串或字符串数组。 可以使用一些PCRE修饰符,包括’… [阅读全文]

使用 preg_replace() 函数为 WordPress 添加搜索关键字高亮

使用 preg_replace() 函数为 WordPress 添加搜索关键字高亮

这两天在完善 BlueNight 主题的搜索功能,给 WordPress 自带的搜索结果添加了单个关键字高亮(以下简称关键词高亮,多关键字的分词高亮也不是一会半会可以搞好的,不过在我的算法更新里简单的实现了多关键字高亮)。之前在网上参考过一些资料,有的是通过获取 Google 或百度的搜索结果来显示,效果不错,不过会搜到很多不相关的内容。有的就是直接简单的在 WordPress 里提供的 get_the_excerpt() 的内容中添加高亮,这样很多时候在摘要中和标题中都看不到搜索的关键字。在参考了各种资料后,自己还是采取直接在 WordPress 的搜索结果上来添加关键字高亮。最后弄出来的搜索结果标题和文章摘要都有高亮,并且保证了… [阅读全文]

Toggle side bar