I'm sort of new to JS and bookmarklets.

I'm modifying some existing code; which is written like this (I'm oversimplifying the actual code for the education purposes):

  javascript: 1 && function(e) {
    var t = "";
    t += "<style>",
    t += ".somestyle-header{ background-color: #0171C5 !important }",
    t += "</style>",
    t += '<div class="somestyle-header">Test</div>',
    t += "";
    e("body").append("<div id='something'> </div>"), e("#something").append(t)
  }($myvariable);

Now, this currently works and it creates a DIV called "something" and then appends everything on variable "t" to it. In other words it adds whatever is on variable "t" to the HTML of the current site (given that the site has the $myvariable set somewhere).

I'm trying to do something similar, but I have the following questions:

1. How can I remove that 1 at the very begining of the function and make it work?
2. How can I make it work on every page?, regardless of the $myvariable at the end being present or not.

Also, if someone can explain what that 1 at the very beginning and that $myvariable at the very end are doing and why this code doesnt work if I remove any of those parts?

I was hoping I can do something like this:

javascript: (function() {

  if (!($ = window.jQuery)) {
      script = document.createElement( 'script' );
      script.src = '.min.js'; 
      script.onload=launchTheSplash;
      document.body.appendChild(script);
  } 
  else {
      launchTheSplash(e);
  }

  function launchTheSplash(e) {
    var t = "";
    t += "<style>",
    t += ".somestyle-header{ background-color: #0171C5 !important }",
    t += "</style>",
    t += '<div class="somestyle-header">Test</div>',
    t += "";
    e("body").append("<div id='something'> </div>"), e("#something").append(t)
  }
}());

So that:

1. I check for the existence of JQuery
2. I launch my bookmarklet regardless of the existence of the $myvariable

But my code doesn't seem to work at all if I remove the 1 at the beginning or the $myvariable at the end. If I do that I get an Uncaught TypeError: e is not a function

Hope this is clear enough. Thanks in advance!

Edit:

I've tried the suggestion below:

javascript: (function() {

  if (!($ = window.jQuery)) {
      script = document.createElement( 'script' );
      script.src = '.3.1/jquery.min.js'; 
      script.onload=launchTheSplash();
      document.body.appendChild(script);
  } 
  else {
      launchTheSplash();
  }

  function launchTheSplash(e = $) {
      var t = "";
      t += "<style>",
      t += ".somestyle-header{ background-color: #011515 !important }",
      t += "</style>",
      t += '<div class="somestyle-header">Test</div>',
      t += "";
      e("body").append("<div id='something'> </div>"), e("#something").append(t);
    }
}());

But it doesnt seem to work on certain pages; for example -if I try to run the bookmarklet in www.apple website it es back with Uncaught TypeError: e is not a function

Any ideas appreciated! Thanks again!

I'm sort of new to JS and bookmarklets.

I'm modifying some existing code; which is written like this (I'm oversimplifying the actual code for the education purposes):

  javascript: 1 && function(e) {
    var t = "";
    t += "<style>",
    t += ".somestyle-header{ background-color: #0171C5 !important }",
    t += "</style>",
    t += '<div class="somestyle-header">Test</div>',
    t += "";
    e("body").append("<div id='something'> </div>"), e("#something").append(t)
  }($myvariable);

Now, this currently works and it creates a DIV called "something" and then appends everything on variable "t" to it. In other words it adds whatever is on variable "t" to the HTML of the current site (given that the site has the $myvariable set somewhere).

I'm trying to do something similar, but I have the following questions:

1. How can I remove that 1 at the very begining of the function and make it work?
2. How can I make it work on every page?, regardless of the $myvariable at the end being present or not.

Also, if someone can explain what that 1 at the very beginning and that $myvariable at the very end are doing and why this code doesnt work if I remove any of those parts?

I was hoping I can do something like this:

javascript: (function() {

  if (!($ = window.jQuery)) {
      script = document.createElement( 'script' );
      script.src = 'http://ajax.googleapis./ajax/libs/jquery/1/jquery.min.js'; 
      script.onload=launchTheSplash;
      document.body.appendChild(script);
  } 
  else {
      launchTheSplash(e);
  }

  function launchTheSplash(e) {
    var t = "";
    t += "<style>",
    t += ".somestyle-header{ background-color: #0171C5 !important }",
    t += "</style>",
    t += '<div class="somestyle-header">Test</div>',
    t += "";
    e("body").append("<div id='something'> </div>"), e("#something").append(t)
  }
}());

So that:

1. I check for the existence of JQuery
2. I launch my bookmarklet regardless of the existence of the $myvariable

But my code doesn't seem to work at all if I remove the 1 at the beginning or the $myvariable at the end. If I do that I get an Uncaught TypeError: e is not a function

Hope this is clear enough. Thanks in advance!

Edit:

I've tried the suggestion below:

javascript: (function() {

  if (!($ = window.jQuery)) {
      script = document.createElement( 'script' );
      script.src = 'https://ajax.googleapis./ajax/libs/jquery/3.3.1/jquery.min.js'; 
      script.onload=launchTheSplash();
      document.body.appendChild(script);
  } 
  else {
      launchTheSplash();
  }

  function launchTheSplash(e = $) {
      var t = "";
      t += "<style>",
      t += ".somestyle-header{ background-color: #011515 !important }",
      t += "</style>",
      t += '<div class="somestyle-header">Test</div>',
      t += "";
      e("body").append("<div id='something'> </div>"), e("#something").append(t);
    }
}());

But it doesnt seem to work on certain pages; for example -if I try to run the bookmarklet in www.apple. website it es back with Uncaught TypeError: e is not a function

Any ideas appreciated! Thanks again!

• javascript
• bookmarklet

Share Improve this question Follow edited Jan 9, 2019 at 22:25 Dan V asked Jan 9, 2019 at 18:26 Dan VDan V 39322 gold badges44 silver badges1111 bronze badges 0

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 1

In order to execute functions immediately, you can use IIFE(https://developer.mozilla/en-US/docs/Glossary/IIFE). The correct syntax to execute functions immediately is -

(function(text){
  console.log(text);
})('Hello World')

In your case e is supposed to be jquery element, so whenever you are calling launch function you should pass $ in it.

Take a look at this snippet - https://jsitor./E8JW18YD-