추가 기능 SDK를 사용하여 탭 스타일 변경

Question

추가 기능 SDK를 사용하여 탭 스타일을 동적으로 변경하려고합니다. 어떻게해야합니까? 여기

내가 시도 내용은 다음과 같습니다

내가 같은 탭 개체에 액세스 할 수 있습니다 그래서

tab.setAttribute('style','background-color:blue'); // the method doesn't exist 
tab.style.backgroundColor='blue'; // type error because style is null 
tab.style='background-color:blue'; // has no effect 

:

var tabs=require('sdk/tabs'); 
tabs.on('ready',function(tab){ 
    console.log('url is: '+tab.url); //-> url is http://www.google.com 
    console.log('stlye is: '+tab.url); //-> style is null 
}); 

을하지만 스타일 속성이 null이며 다음 작업 없음 탭의 스타일을 어떻게 동적으로 바꿀 수 있습니까?

var { modelFor } = require("sdk/model/core"); 
var { viewFor } = require("sdk/view/core"); 

var tabs = require("sdk/tabs"); 
var tab_utils = require("sdk/tabs/utils"); 

function mapHighLevelToLowLevel(tab) { 
    // get the XUL tab that corresponds to this high-level tab 
    var lowLevelTab = viewFor(tab); 
    // now we can, for example, access the tab's content directly 
    var browser = tab_utils.getBrowserForTab(lowLevelTab); 
    console.log(browser.contentDocument.body.innerHTML); 
    // get the high-level tab back from the XUL tab 
    var highLevelTab = modelFor(lowLevelTab); 
    console.log(highLevelTab.url); 
} 

tabs.on("ready", mapHighLevelToLowLevel); 

을하지만 코드는 오류가 발생합니다 : 내가 시도 또 한가지 code from the docs 사용하여 XUL 객체에 탭을 변환됩니다 이 모듈 'SDK/모델/코어'자원에서 발견되지 : // GRE/모듈 /commonjs/sdk/model/core.js 안내를 따라 core.js 파일을 만들었지 만. 또한 var { modelFor}= 구문에서 중괄호가 무엇을하는지 이해할 수 없습니다.

도움 주셔서 감사합니다.

Answer 1

xul 탭 요소에 액세스해야합니다.

이 시도 : HTML 문서의 최상위 창으로

var tabsLib = require("tabs/tab.js"); 
var tab = tabsLib.getTabForWindow(htmlWindow); 
tab.style.color = 'red'; //makes the tab text red 

패스 htmlWindow합니다. 따라서 document.defaultView.top과 같습니다. document.defaultView는 나던 작업 후 바로 브라우저 창을 얻을 경우,이 예제는 가장 최근의 브라우저 창 (브라우저 창이있는 파이어 폭스 창입니다 (브라우저 창을 여러 개 열어이있을 수 있습니다 마음에 keeep을 가져옵니다 document

의 window입니다 탭, [아마되는 Windows는 SDK에 확실하지 메신저 팝업])

const { getMostRecentBrowserWindow } = require('sdk/window/utils'); 
    var aDOMWindow = getMostRecentBrowserWindow(); 
    if (aDOMWindow.gBrowser && aDOMWindow.gBrowser.tabContainer) { 
     var tabs = aDOMWindow.gBrowser.tabContainer.childNodes; 
      for (var i=0; i<tabs.length; i++) { 
       tabs[i].style.color = 'red'; //makes the tab text red; 
      } 
    }