Como serviços hospedados como UserVoice incorporar seu conteúdo em outros sites?

Question

serviços Como hospedados como UserVoice incorporar seu conteúdo em outros sites?

Eu vejo que é via incluindo um arquivo JavaScript do provedor de serviços em sua própria página, no entanto, o que eu estou interessado em são os blocos de construção para a criação de um serviço como esse.

Por exemplo, eles usam uma biblioteca como jQuery, MooTools, ou PrototypeJS e como eles evitar conflitos de namespace?

Também se perguntou se havia livros, artigos, posts que vão sobre esta utilização específica de JavaScript (não à procura de recursos gerais em JavaScript).

Cumprimentos e obrigado antecipadamente,

Eliot

Answer 1

Aqui é um ótimo tutorial que encontrei na Como construir um widget web (usando jQuery)

Answer 2

Geralmente, o que você está descrevendo é chamado de "Javascript Widget" (UserVoice só acontece a mostrar-se no lado da página).

Há um bom tutorial sobre criação de JavaScript Widgets que você pode conferir.

Answer 3

A estrutura básica de um serviço tão embutido seria:

1. Se o serviço não obriga que o script deve ser incluído na parte inferior da página, ligar o evento onload corpo, sem pisar nos dedos do pé de quaisquer manipuladores existentes (por interceptar a função de tratamento existente, o que poderia, em transformar ser acorrentado a outras funções).
2. Inject novos elementos de HTML no documento. O código HTML provavelmente ser embutido no script como strings literais como a criação innerHTML em um único elemento injetado seria mais fácil e mais rápido do que a manipulação DOM direta usando uma onda de chamadas de função.
3. Todo o script deve viver dentro de um fecho de conflitos de nome evitar.
pode ou não ser utilizado quadro
4. A JS; É necessário cuidado quando incluindo um quadro, uma vez que poderia colidir com, um quadro diferente pré-existente, ou uma versão diferente do mesmo quadro.

Answer 4

EDT: Geralmente você vai fazer o seu cliente / cliente / amigo incluir um script em sua página, em seguida, via esse script você pode fazer seguinte:

Em JS puras você pode carregar scripts de localização remota (ou não tão remoto) dinamicamente via

   var script = document.createElement('script');
   script.type = 'text/javascript';
   script.src = 'your/remote/scripts/path.js';
   document.getElementsByTagName('body')[0].appendChild(script);

// $ .getScript ( 'seu / remote / scripts / path.js'); em jquery, mas você vai ter a certeza jQuery carregado no site remoto

roteiro Então você carregado pode executar ações diferentes, como a criação de elementos como este

= var corpo document.getElementsByTagName ( 'corpo') [0]; var Adiv = document.createElement ( 'script'); / * Aqui você pode modificar suas propriedades divs e olhar * / body.appendChild (Adiv); // $ ( '') appendTo. ( 'Body'); para jQuery

Para olhar mais profundo em JavaScript você pode ler por exemplo Javascript: The Good Parts ou Definitive Guide To Javascript .