|
Часто бывает нужно найти элементы HTML, которые используют атрибут ID как уникальный в документе HTML.
JavaScript поддерживает встроенный метод для этого - document.getElementById. К сожалению нет подобного метода, доступного из MSHTML для использования с документами HTML, загруженными в TWebBrowser. Так что мы должны будем сделать свой собственный:
uses
MSHTML, SysUtils, Variants;
function GetElementById(const Doc: IDispatch; const Id: string): IDispatch;
var
Document: IHTMLDocument2; // IHTMLDocument2 interface of Doc
Body: IHTMLElement2; // document body element
Tags: IHTMLElementCollection; // all tags in document body
Tag: IHTMLElement; // a tag in document body
I: Integer; // loops thru tags in document body
begin
Result := nil;
// Проверяем правильность документа: требуется интерфейс IHTMLDocument2
if not Supports(Doc, IHTMLDocument2, Document) then
raise Exception.Create('Invalid HTML document');
// Check for valid body element: require IHTMLElement2 interface to it
if not Supports(Document.body, IHTMLElement2, Body) then
raise Exception.Create('Не могу найти элемент ');
// Получаем все теги элементов в body ('*' => любое имя тега)
Tags := Body.getElementsByTagName('*');
// Сканируем все теги в body
for I := 0 to Pred(Tags.length) do
begin
// Получаем ссылки на теги
Tag := Tags.item(I, EmptyParam) as IHTMLElement;
// Check tag's id and return it if id matches
if AnsiSameText(Tag.id, Id) then
begin
Result := Tag;
Break;
end;
end;
end;
Функция получает ссылку на интерфейс IDispatch управления браузера объект Document. Возвращает или интерфейс IDisptach с требуемым тегом Id или nil если тег с требуемым id не существует. Возвращаемое значение может приводиться к требуемому тегу интерфейса, например для IHTMLElement или IHTMLElement2.
Пример
Сначала создайте маленький документ HTML, который содержит хотя бы один элемент, который имеет атрибут id. Вот пример, назовем его Test.html и сохраним в том же каталоге, что и приложение:
<?xml version="1.0"?>
<!DOCTYPE html
PUBLIC "//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Tip#36 Test</title>
</head>
<body>
<p>Paragraph with no id</p>
<p id="myid">Paragraph with id = myid</p>
</body>
</html>
Теперь создайте новое приложение Delphi и поместите на форму TWebBrowser и TButton.
Добавьте следующий обработчик события OnShow для формы, чтобы загрузить тестируемый документ в браузер:
procedure TForm1.FormShow(Sender: TObject);
begin
WebBrowser1.Navigate(
'file:///' + ExtractFilePath(ParamStr(0)) + 'test.html'
);
end;
Далее, добавьте обработчик события OnClick для кнопки:
procedure TForm1.Button1Click(Sender: TObject);
var
Elem: IHTMLElement;
begin
Elem := GetElementById(WebBrowser1.Document,
'myid') as IHTMLElement;
if Assigned(Elem) then
ShowMessage(
'Tag name = <' + Elem.tagName + '>'#10 +
'Tag id = ' + Elem.id + #10 +
'Tag innerHTML = "' + Elem.innerHTML + '"'
);
end;
Это осуществляет наша функция GetElementById, которая находит элемент параграфа с id = myid и отображает некоторую информацию относительно элементов в окне сообщения.
Одно использование кода должно изменить отображаемый HTML на уровень тега. Чтобы проиллюстрировать это, поместите на форму другую кнопку и запишите следующий обработчик события OnClick для этой кнопки:
procedure TForm1.Button2Click(Sender: TObject);
var
Elem: IHTMLElement;
begin
Elem := GetElementById(WebBrowser1.Document,
'myid') as IHTMLElement;
if Assigned(Elem) then
Elem.innerHTML := 'My new text';
end;
Запустите приложение и щелкните Button1 обратите внимание на внутренний HTML, отображаемый в окне сообщения.
Теперь щелкните Button2 и наблюдайте изменение текста. Если Вы щелкните Button1, Вы увидите, что внутренний HTML изменился.
Автор: Peter Johnson
|
Комментарии
Writing manually is time consuming, but there is solution for this
hard task. Just search for: Miftolo's tools rewriter
RSS лента комментариев этой записи