JQuery 仅附加到子项

JQuery only append to child

这个用户脚本似乎以某种方式将属性附加到父项而不是子项:c

请帮助我理解它为什么这样做 :o

// ==UserScript==
// @name        GMod Cinema Porn
// @namespace   Bluscream
// @version     1.0
// @description H3H3
// @author      Bluscream
// @include     https://www.youtube.com/embed/OiMTuwS3xvg*
// @include     http://cinema.pixeltailgames.com/search.html
// @include     *
// @grant       unsafeWindow
// @grant       GM_xmlhttpRequest
// @require     https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js
// @run-at      document-end
// ==/UserScript==
(function() {
    'use strict';
    if (window.location.href.startsWith("https://www.youtube.com/embed/OiMTuwS3xvg")) {
        window.location.href = "http://embed.redtube.com/player/?id=42019&autostart=true";
    } else if (window.location.href == "http://cinema.pixeltailgames.com/search.html"){
        $ = jQuery || $;
        $( document ).ready(function() {
            temop = $('#content-container').children('div[style="text-align:center;font-size:0;"]:first');
            temop.append('<service>').css('background-image', 'url("http://cdn1-www.craveonline.com/assets/uploads/2013/12/man_file_1048340_youporn-icon.png")').click(function () {
                window.selectService("YouPorn", "http:\/\/www.youporn.com");
            }).hover(function () {
                window.hoverService();
            });
        });
        //$('#content-container>div[style="text-align:center;font-size:0;"]').append('<service style=\'background-image:url(\"logos\/youtube.png\")\' onclick=\'selectService(\"YouTube\",\"http:\/\/www.youtube.com\")\' onmouseover="hoverService()">-</service>');
    }
})();

因为 jQuery 元素是可链接的,使用 .append() 将 return 前一个元素,而不是刚刚附加的元素。

附加元素需要在应用属性和事件监听器之前被定位;像这样:

temop
  .append('<service>')
  .find('service:last')
  .css(/* ... */)
  .click(/* ... */)
  .hover(/* ... */);