Могу ли я добавить или изменить HTML-код в «Инспектировании элемента». У меня есть кнопка ссылки «Домой», которую я хочу изменить. Я использовал опцию правой кнопки мыши, но мои изменения не сохранены?

2 ответа2

3

Вы не говорите, в каком браузере вы находитесь, но если это Chrome, ответ - да.

После того, как вы выбрали элемент, щелкните правой кнопкой мыши и выберите "Изменить HTML"

Тем не менее, обратите внимание, что это не сохранит веб-сайт или что-либо еще, а только отредактирует вашу локальную копию. Если вы обновите страницу, она вернется к тому, что было. альтернативный текст

1

Как уже говорили другие, вы можете изменить ссылку, используя Inspect Element , но это изменение не будет сохранено при следующей загрузке страницы.

Если вы хотите, чтобы ссылка изменялась при каждом открытии страницы, вы можете использовать Greasemonkey или другие подобные дополнения в зависимости от того, какой браузер вы используете. (Для Firefox вы можете использовать Greasemonkey).

Вот скрипт Greasemonkey который должен делать то, что вы хотите:

// ==UserScript==
// @name        Test-SU-236831-edit-link
// @namespace   Test-SU
// @description Test-SU-236831-edit-link
// @include     http://superuser.com/questions/236831/*
// @include     http://www.superuser.com/questions/236831/*
// @version     1
// @grant       none
// ==/UserScript==

  var GMnode,GMelID,GMmsg="";
  GMelID="nav-questions";
  GMnode=document.getElementById(GMelID);
  if((GMnode!==null)&&(GMnode.hasAttribute("href"))){
    GMmsg="OLD getAttribute-href="+GMnode.getAttribute("href")+"\n";
    GMnode.setAttribute("href","http://www.google.com/");
    GMmsg=GMmsg+"NEW getAttribute-href="+GMnode.getAttribute("href");
    alert(GMmsg);
  }
  else{
    alert("Can't find <a> element with id='"+GMelID+"'");
  }

В приведенном выше сценарии есть несколько операторов "отладки", чтобы вы могли видеть, что происходит при загрузке страницы. Вот тот же сценарий без операторов "отладки":

// ==UserScript==
// @name        Test-SU-236831-edit-link
// @namespace   Test-SU
// @description Test-SU-236831-edit-link
// @include     http://superuser.com/questions/236831/*
// @include     http://www.superuser.com/questions/236831/*
// @version     1
// @grant       none
// ==/UserScript==

  var GMnode,GMelID;
  GMelID="nav-questions";
  GMnode=document.getElementById(GMelID);
  if((GMnode!==null)&&(GMnode.hasAttribute("href"))){
    GMnode.setAttribute("href","http://www.google.com/");
  }

В случае, если вы не знакомы с Greasemonkey , чтобы использовать вышеописанный сценарий, вам необходимо сначала установить дополнение Greasemonkey , а затем добавить указанный выше сценарий в качестве нового User Script .

Вы можете изменить @name , @namespace и @description на любые строки, которые вы хотите, чтобы уникальным образом идентифицировать User Script .

Измените поле @include на, чтобы указать URL-адрес, на который вы хотите воздействовать User Script . Вы можете иметь более одного поля @include .

Greasemonkey будет запускаться и действовать на веб-странице после того, как документ будет "Готов", то есть после загрузки всей страницы, включая <Body> и всех внешних сценариев, но до загрузки ресурсов страницы, таких как изображения и некоторые динамически загружаемые сценарии. Есть шаги, которые вы можете предпринять, чтобы убедиться, что Greasemonkey ожидает загрузки всех этих других ресурсов, прежде чем запускать ваш код. Это можно сделать, добавив eventlistener для выполнения вашего кода после события onload . В большинстве случаев в этом нет необходимости, но в случае, если это для вашей целевой веб-страницы, вот сценарий Greasemonkey для этого:

// ==UserScript==
// @name        Test-SU-236831-edit-link
// @namespace   Test-SU
// @description Test-SU-236831-edit-link
// @include     http://superuser.com/questions/236831/*
// @include     http://www.superuser.com/questions/236831/*
// @version     1
// @grant       none
// ==/UserScript==

  if (window.addEventListener) {
    window.addEventListener('load', readytogo, false);
  }
  else {
    if (window.attachEvent) {
      window.attachEvent('onload', readytogo);
    }
  }

  function readytogo() {
    var GMnode,GMelID;
    GMelID="nav-questions";
    GMnode=document.getElementById(GMelID);
    if((GMnode!==null)&&(GMnode.hasAttribute("href"))){
      GMnode.setAttribute("href","http://www.google.com/");
    }
  }

Всё ещё ищете ответ? Посмотрите другие вопросы с метками .