input 框的 placeholder 属性换行显示

const string = 'Share Your Requirement With Us: * - What Are You Looking For - Features/Specifications - Application/Usage - Destination Port - Quantity, etc.'
$('textarea').attr('placeholder', string.replace(/\-/g, '\n-')); //把-替换为换行符-

监听页面滚动

window.addEventListener('scroll', function(){
  const t = window.scrollY;
})

禁止复制网站内容

• 禁止复制

(function(a){"undefined"==typeof a.onselectstart?"undefined"==typeof a.style.MozUserSelect?a.onmousedown=function(){return!1}:a.style.MozUserSelect="none":a.onselectstart=function(){return!1},a.style.cursor="default"})(document.body);

• 禁止复制和右键

document.onmousedown=function(){return!1},document.onselectstart=function(){return!1},window.Event&&document.captureEvents(Event.MOUSEUP);function nocontextmenu(){return event.cancelBubble=!0,event.returnValue=!1,!1}function norightclick(a){if(window.Event){if(2==a.which||3==a.which)return!1;}else if(2==event.button||3==event.button)return event.cancelBubble=!0,event.returnValue=!1,!1}document.oncontextmenu=nocontextmenu,document.onmousedown=norightclick;

页面平滑滑动到想要的位置

1. animate

$('html, body').animate({ scrollTop: 100, easing: 'swing' }, 1000);

2. scrollTo

window.scrollTo({
  top: 100, //距顶部的距离
  behavior: "smooth" //behavior 类型String,表示滚动行为,支持参数 smooth(平滑滚动),instant(瞬间滚动),默认值auto（等同于instant）
})

判断当前页面是直接打开，还是由其他页面跳转

const referrer = document.referrer
if(referrer === '') {
  alert('直接打开')
}

JS判断是否显示了省略号

有时候我们需要知道是否已经溢出，显示了省略号，可以用到clientHeight和scrollHeight的知识：

const cHeight = noWrapDiv.clientHeight;
const sHeight = noWrapDiv.scrollHeight;
if (sHeight > cHeight) {
  console.log("已经溢出显示省略号");
} else {
  console.log("没有溢出");
}

这里可以用于判断是否溢出显示展开收缩按钮。

知识点拓展

scrollHeight：元素内容的高度，包括由于溢出导致的视图中不可见内容。不包含滚动条、边框和外边距。

clientHeight：元素内容的可视区的高度，包含内边距，但不包括水平滚动条、边框和外边距。

offsetHeight：元素的像素高度，高度包含该元素的垂直内边距和边框，且是一个整数。