Javascript 按符号切片字符串

Question

如何从这个 html 代码中获取

<a href="www.realy-long-link.com">Link<a>

Href 值看起来像这样 - Realy Long Link 并将其附加到正文中。

这是我现在所做的。

$("a").hide();
$("body").append($("a").attr("href"));

目标是:

• 删除开头的 www. 和结尾的 .com。
• 符号 - 用空格替换。
• 大写每个第一个字符

您可以编辑我的codepen http://codepen.io/anon/pen/YWzJXM?editors=1010

Answer 1

使用replace() 方法

var a = document.getElementsByTagName('a');
a[0].style.display = 'none';
document.body.innerHTML += a[0].getAttribute('href')
  // remove www. and .com
  .replace(/^www\.|\.com$/g, '')
  // convert first letter to upper case
  .replace(/\b\w/g, function(m) {
    return m.toUpperCase()
  })
  // replace - with space
  .replace(/-/g, ' ')

<a href="www.realy-long-link.com">Link<a>

<小时/> 尽管您可以在没有任何正则表达式的情况下完成此操作

var a = document.getElementsByTagName('a');
a[0].style.display = 'none';
document.body.innerHTML += a[0].getAttribute('href')
  // split based on `'`
  .split('.')
  // remove `www` and  `com` from array
  .slice(1, -1)
  // join again
  .join('.')
  // split based on `-`
  .split('-')
  // capitalize first letter
  .map(function(v) {
    return v.charAt(0).toUpperCase() + v.slice(1);
  })
  // join by space
  .join(' ')

<a href="www.realy-long-link.com">Link<a>

<小时/>

更新:具有相同代码的 JQuery 解决方案

$('body').append($('a').hide().attr('href').replace(/^www\.|\.com$/g, '').replace(/\b\w/g, function(m) {
  return m.toUpperCase();
}).replace(/-/g, ' '));

//or
/*

$('body').append($('a').hide().attr('href').split('.').slice(1, -1).join('.').split('-').map(function(v) {
  return v.charAt(0).toUpperCase() + v.slice(1);
}).join(' '));

*/

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="www.realy-long-link.com">Link<a>