定义页面加载和导航时要执行的函数/自定义事件

/**
 * Copyright 2017 Google Inc. All rights reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

‘use strict‘;

const puppeteer = require(‘puppeteer‘);

(async() => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();

  // Define a window.onCustomEvent function on the page.
  await page.exposeFunction(‘onCustomEvent‘, e => {
    console.log(`${e.type} fired`, e.detail || ‘‘);
  });

  /**
   * Attach an event listener to page to capture a custom event on page load/navigation.
   * @param {string} type Event name.
   * @return {!Promise}
   */
  function listenFor(type) {
    return page.evaluateOnNewDocument(type => {//定义页面加载和导航时要执行的函数
      document.addEventListener(type, e => {
        window.onCustomEvent({type, detail: e.detail});
      });
    }, type);
  }

  await listenFor(‘app-ready‘); // Listen for "app-ready" custom event on page load.

  await page.goto(‘https://www.chromestatus.com/features‘, {waitUntil: ‘networkidle0‘});

  await browser.close();
})();

原文地址:https://www.cnblogs.com/justart/p/9750360.html

时间: 2024-10-11 16:00:28

定义页面加载和导航时要执行的函数/自定义事件的相关文章

【iOS开发】视图控制器加载和卸载时的几个函数

1.-(void)loadView 你应该永远不要直接调用这个函数.当视图控制器的view属性被请求但是其值为nil时,该函数将会被调用.该函数加载或创建一个视图并把它分配给view属性. 如果视图控制器有一个与之相关联的nib文件,这个方法将会从nib文件中加载视图.当视图控制器的nibName属性的值不是nil时,就说明视图控制器有一个与之相关联的nib文件.如果你直接用initWithNibName:bundle:函数给视图控制器分配一个nib文件或者如果ios发现再应用程序中有一个以视图

页面加载的时候自动的执行js代码

<script> window.onload=MyAutoRun; function MyAutoRun(){ alert("函数自动执行哦!"); } </script>

页面加载完毕执行多个JS函数

通常我们需要在打开页面时加载脚本,这些脚本必须在页面加载完毕后才可以执行,因为这时候DOM才完整,可以利用window.onload确保这一点,如:window.onload=firstFunction;这脚本的意思是在页面完毕后执行firstFunction函数,但当有很多个函数需要在页面加载时执行呢?可能有人说可以这样:window.onload=firstFunction;window.onload=secondFunction; 但这样的话只会执行secondFunction函数. Si

使用 document.onreadystatechange()来判断页面加载完

document.onreadystatechange = subSomething;//当页面加载状态改变的时候执行这个方法. function subSomething() {  if(document.readyState == "complete"){ //当页面加载状态为完全结束时进入               //你要做的操作.    }} 说明 :onreadystatechange 事件能辨识readyState 属性的改变. 一般可用 document.onread

页面加载完毕相关信息淡入效果

前言: 年关将至,公司一部分同事已经回老家了,虽然过年不回去,但想到明天上完班就放假了内心多少有点激动.工作上的事情不要紧的已经没心情再看了,加之今天领导不在 哈哈哈... 搞点自己的爱好! 看bootstrap的优站精选时看到了一个页面加载完毕时的一个淡入效果(http://www.mikeinghamdesign.com/),于是... 效果图: 实现思路: 此处实现主要用外边距margin-top属性和透明度opacity属性: 1.淡入区块初始设置一定上外边距,透明度完全透明: 2.页面

document.onreadystatechange()来判断页面加载完

document.onreadystatechange = subSomething;//当页面加载状态改变的时候执行这个方法. function subSomething() {  if(document.readyState == "complete"){ //当页面加载状态为完全结束时进入               //你要做的操作.    }}

js 判断页面加载状态

//----判断当前页面是否加载状态 开始 ---- document.onreadystatechange = subSomething;//当页面加载状态改变的时候执行这个方法. function subSomething() { if (document.readyState != 'complete') //当页面加载状态 { //----显示遮罩 开始---- $(".overlay").css({ 'display': 'block', 'opacity': '0.8' }

页面加载完成 使用总结

页面加载完成的方法有两个函数: 1.jq的ready()方法: 2.js的window.onload = function(){}方法: 区别: ready()方法指的是html的dom加载完成(图片,文字等不一定加载完成): window.onload = function(){}方法指的是html的内容加载完成(包括文字,图片,动画等): 在选用的时候要针对情况选择: 另外也可以使用以下代码判断页面内容是否加载完成: function funame() { if(document.ready

JavaScript 之 页面加载事件

一.onload 加载事件 onload 是 window 对象的一个事件,也可以省略 window 直接使用. 常用方式: <head><script> windown.onload = function() { // 方法体 } </script><head>  这个事件是等待页面加载完成之后,再执行 <script> 标签的内容.即页面上所有的元素创建完毕,并且引用的外部资源下载完毕(js,css,图片)  注意:该事件相比于在 <b