Бих искал да споделя с вас страхотен трик за Mozilla Firefox, който може да увеличи вашата производителност и да спести вашето време. Докато сърфирате в мрежата, понякога искате да споделите нещо с приятелите си, като направите екранна снимка на това. Но са необходими няколко стъпки, за да направите екранна снимка на цялата страница, да я запазите, да я изрежете и т.н. В тази статия ще видим как директно да направите екранна снимка на определен елемент на уеб страница, без да използвате добавки.
Реклама
Когато се зареди уеб страница, вашият уеб браузър създава обектен модел на документ на страницата. DOM е конструиран като дървовидна структура, при която всеки възел е обект, представляващ част от документа.
Нека да видим как можете да използвате това, за да заснемете само определен елемент във вашата екранна снимка.
Да се направете екранна снимка на конкретен елемент на уеб страница във Firefox , направете следните стъпки:
- Отворете желаната страница във Firefox и щракнете с десния бутон върху елемента, който искате да заснемете.
- От контекстното меню изберете „Проверка на елемент“:
- Инструментът за инспектор ще бъде отворен. Забележете, че той има контролен контрол за възлите на DOM дървото:
- Там можете да щракнете с десния бутон върху който и да е елемент и да изберете Възел на екранна снимка от контекстното меню:
Точно от това се нуждаем.
Точно от това се нуждаем.Най-хубавото на тази функция е, че тя улавя и дълги елементи, включително повечето елементи, които изискват превъртане. В моя случай ето как изглежда екранната снимка:
Като алтернатива можете да използвате вградената снимка на екрана команда. По-рано писах Как да направите екранна снимка на отворената страница във Firefox . В споменатата статия използвахме вградената команда на Firefox „екранна снимка“, за да заснемем цялата страница. Същата функционалност може да се използва за скрийншот на конкретен елемент на отворената страница.
- Отворете Firefox и натиснете Shift + F2 на клавиатурата. Firefox ще отвори конзола / команден ред в долната част на екрана.
- Въведете следната команда в нея:
екранна снимка - селектор „име“
Заменете името „част“ със съответното име на селектора. В моя случай би трябвало
снимка на екрана --selector '# widget-apps> .iconlist> .iconlist-content> ul'
Вторият метод е полезен за уеб разработчици, които знаят точния път на DOM елемента. Обикновеният потребител очевидно ще предпочете първия метод да направи екранна снимка на определен елемент на уеб страница.
