Mixing
Can I inject JavaScript and CSS into Xamarin Form WebView?
My Xamarin Form WebView loads an external webpage like this,
<WebView VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" Source="<SOME_URL_HERE>" />
I need to hide the web page's menu injecting JavaScript or CSS. I also need to hide some unnecessary elements of a web page while it is loading through the app.
What is the best way to achieve this requirement? If there is any other way than JavaScript or CSS, that is also acceptable.
webview xamarin.forms android-webview
edited Nov 21 '18 at 7:17
Steven
127k17215332
asked Nov 21 '18 at 0:51
A.M.RoomiA.M.Roomi
906
add a comment |
My Xamarin Form WebView loads an external webpage like this,
<WebView VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" Source="<SOME_URL_HERE>" />
I need to hide the web page's menu injecting JavaScript or CSS. I also need to hide some unnecessary elements of a web page while it is loading through the app.
What is the best way to achieve this requirement? If there is any other way than JavaScript or CSS, that is also acceptable.
webview xamarin.forms android-webview
edited Nov 21 '18 at 7:17
Steven
127k17215332
asked Nov 21 '18 at 0:51
A.M.RoomiA.M.Roomi
906
add a comment |
My Xamarin Form WebView loads an external webpage like this,
<WebView VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" Source="<SOME_URL_HERE>" />
I need to hide the web page's menu injecting JavaScript or CSS. I also need to hide some unnecessary elements of a web page while it is loading through the app.
What is the best way to achieve this requirement? If there is any other way than JavaScript or CSS, that is also acceptable.
webview xamarin.forms android-webview
edited Nov 21 '18 at 7:17
Steven
127k17215332
asked Nov 21 '18 at 0:51
A.M.RoomiA.M.Roomi
906
My Xamarin Form WebView loads an external webpage like this,
<WebView VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" Source="<SOME_URL_HERE>" />
I need to hide the web page's menu injecting JavaScript or CSS. I also need to hide some unnecessary elements of a web page while it is loading through the app.
What is the best way to achieve this requirement? If there is any other way than JavaScript or CSS, that is also acceptable.
webview xamarin.forms android-webview
webview xamarin.forms android-webview
edited Nov 21 '18 at 7:17
Steven
127k17215332
asked Nov 21 '18 at 0:51
A.M.RoomiA.M.Roomi
906
edited Nov 21 '18 at 7:17
Steven
127k17215332
asked Nov 21 '18 at 0:51
A.M.RoomiA.M.Roomi
906
edited Nov 21 '18 at 7:17
Steven
127k17215332
edited Nov 21 '18 at 7:17
Steven
127k17215332
edited Nov 21 '18 at 7:17
Steven
127k17215332
127k17215332
asked Nov 21 '18 at 0:51
A.M.RoomiA.M.Roomi
906
asked Nov 21 '18 at 0:51
A.M.RoomiA.M.Roomi
906
asked Nov 21 '18 at 0:51
A.M.RoomiA.M.Roomi
906
906
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
The WebView provides an EvaluateJavaScriptAsync method (see here), that you can use to execute JS.
You could for example subscribe to the Navigated event (see here)
<WebView VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" Source="<SOME_URL_HERE>" Navigated="WebViewOnNavigated" />
and when the WebView has navigated to, you can execute your JS from code behind
public async void WebViewOnNavigated(object sender, WebNavigatedEventArgs args)
{
var webView = sender as WebView; // ommitting the null check, since nobody else will call this method
await webView.EvaluateJavaScriptAsync("<Your JS goes here>");
}
answered Nov 21 '18 at 6:43
Paul KertscherPaul Kertscher
5,00741937
Simple JS such as alert are working but hiding elements etc not working. even this code is not workingvar webView = sender as WebView;var js = "document.getElementsByClassName('header_top').remove();";await webView.EvaluateJavaScriptAsync(js);
– A.M.Roomi
Nov 21 '18 at 15:54
@A.M.RoomigetElementsByClassName"Returns an array-like object of all child elements" (see here) - To remove the header you'll have to access a single element of that collection:document.getElementsByClassName('header_top')[0].remove();(I have elided a check whether the element really exists.)
– Paul Kertscher
Nov 22 '18 at 5:56
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53403799%2fcan-i-inject-javascript-and-css-into-xamarin-form-webview%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
The WebView provides an EvaluateJavaScriptAsync method (see here), that you can use to execute JS.
You could for example subscribe to the Navigated event (see here)
<WebView VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" Source="<SOME_URL_HERE>" Navigated="WebViewOnNavigated" />
and when the WebView has navigated to, you can execute your JS from code behind
public async void WebViewOnNavigated(object sender, WebNavigatedEventArgs args)
{
var webView = sender as WebView; // ommitting the null check, since nobody else will call this method
await webView.EvaluateJavaScriptAsync("<Your JS goes here>");
}
answered Nov 21 '18 at 6:43
Paul KertscherPaul Kertscher
5,00741937
Simple JS such as alert are working but hiding elements etc not working. even this code is not workingvar webView = sender as WebView;var js = "document.getElementsByClassName('header_top').remove();";await webView.EvaluateJavaScriptAsync(js);
– A.M.Roomi
Nov 21 '18 at 15:54
@A.M.RoomigetElementsByClassName"Returns an array-like object of all child elements" (see here) - To remove the header you'll have to access a single element of that collection:document.getElementsByClassName('header_top')[0].remove();(I have elided a check whether the element really exists.)
– Paul Kertscher
Nov 22 '18 at 5:56
add a comment |
The WebView provides an EvaluateJavaScriptAsync method (see here), that you can use to execute JS.
You could for example subscribe to the Navigated event (see here)
<WebView VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" Source="<SOME_URL_HERE>" Navigated="WebViewOnNavigated" />
and when the WebView has navigated to, you can execute your JS from code behind
public async void WebViewOnNavigated(object sender, WebNavigatedEventArgs args)
{
var webView = sender as WebView; // ommitting the null check, since nobody else will call this method
await webView.EvaluateJavaScriptAsync("<Your JS goes here>");
}
answered Nov 21 '18 at 6:43
Paul KertscherPaul Kertscher
5,00741937
Simple JS such as alert are working but hiding elements etc not working. even this code is not workingvar webView = sender as WebView;var js = "document.getElementsByClassName('header_top').remove();";await webView.EvaluateJavaScriptAsync(js);
– A.M.Roomi
Nov 21 '18 at 15:54
@A.M.RoomigetElementsByClassName"Returns an array-like object of all child elements" (see here) - To remove the header you'll have to access a single element of that collection:document.getElementsByClassName('header_top')[0].remove();(I have elided a check whether the element really exists.)
– Paul Kertscher
Nov 22 '18 at 5:56
add a comment |
The WebView provides an EvaluateJavaScriptAsync method (see here), that you can use to execute JS.
You could for example subscribe to the Navigated event (see here)
<WebView VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" Source="<SOME_URL_HERE>" Navigated="WebViewOnNavigated" />
and when the WebView has navigated to, you can execute your JS from code behind
public async void WebViewOnNavigated(object sender, WebNavigatedEventArgs args)
{
var webView = sender as WebView; // ommitting the null check, since nobody else will call this method
await webView.EvaluateJavaScriptAsync("<Your JS goes here>");
}
answered Nov 21 '18 at 6:43
Paul KertscherPaul Kertscher
5,00741937
The WebView provides an EvaluateJavaScriptAsync method (see here), that you can use to execute JS.
You could for example subscribe to the Navigated event (see here)
<WebView VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" Source="<SOME_URL_HERE>" Navigated="WebViewOnNavigated" />
and when the WebView has navigated to, you can execute your JS from code behind
public async void WebViewOnNavigated(object sender, WebNavigatedEventArgs args)
{
var webView = sender as WebView; // ommitting the null check, since nobody else will call this method
await webView.EvaluateJavaScriptAsync("<Your JS goes here>");
}
answered Nov 21 '18 at 6:43
Paul KertscherPaul Kertscher
5,00741937
answered Nov 21 '18 at 6:43
Paul KertscherPaul Kertscher
5,00741937
answered Nov 21 '18 at 6:43
Paul KertscherPaul Kertscher
5,00741937
answered Nov 21 '18 at 6:43
Paul KertscherPaul Kertscher
5,00741937
5,00741937
Simple JS such as alert are working but hiding elements etc not working. even this code is not workingvar webView = sender as WebView;var js = "document.getElementsByClassName('header_top').remove();";await webView.EvaluateJavaScriptAsync(js);
– A.M.Roomi
Nov 21 '18 at 15:54
@A.M.RoomigetElementsByClassName"Returns an array-like object of all child elements" (see here) - To remove the header you'll have to access a single element of that collection:document.getElementsByClassName('header_top')[0].remove();(I have elided a check whether the element really exists.)
– Paul Kertscher
Nov 22 '18 at 5:56
add a comment |
Simple JS such as alert are working but hiding elements etc not working. even this code is not workingvar webView = sender as WebView;var js = "document.getElementsByClassName('header_top').remove();";await webView.EvaluateJavaScriptAsync(js);
– A.M.Roomi
Nov 21 '18 at 15:54
@A.M.RoomigetElementsByClassName"Returns an array-like object of all child elements" (see here) - To remove the header you'll have to access a single element of that collection:document.getElementsByClassName('header_top')[0].remove();(I have elided a check whether the element really exists.)
– Paul Kertscher
Nov 22 '18 at 5:56
Simple JS such as alert are working but hiding elements etc not working. even this code is not working
var webView = sender as WebView; var js = "document.getElementsByClassName('header_top').remove();"; await webView.EvaluateJavaScriptAsync(js);– A.M.Roomi
Nov 21 '18 at 15:54
Simple JS such as alert are working but hiding elements etc not working. even this code is not working
var webView = sender as WebView; var js = "document.getElementsByClassName('header_top').remove();"; await webView.EvaluateJavaScriptAsync(js);– A.M.Roomi
Nov 21 '18 at 15:54
@A.M.Roomi
getElementsByClassName "Returns an array-like object of all child elements" (see here) - To remove the header you'll have to access a single element of that collection: document.getElementsByClassName('header_top')[0].remove(); (I have elided a check whether the element really exists.)– Paul Kertscher
Nov 22 '18 at 5:56
@A.M.Roomi
getElementsByClassName "Returns an array-like object of all child elements" (see here) - To remove the header you'll have to access a single element of that collection: document.getElementsByClassName('header_top')[0].remove(); (I have elided a check whether the element really exists.)– Paul Kertscher
Nov 22 '18 at 5:56
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53403799%2fcan-i-inject-javascript-and-css-into-xamarin-form-webview%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
