Cannot manipulate DOM elements using Javascript (or jQuery) : Wikitude

L

Lance Do

started a topic almost 7 years ago

Hi,

I'm using Wikitude on Android (using Xamarin). After the web page is loaded, I cannot manipulate DOM element(s) using Javascript. jQuery cannot work too. Below is my HTML and Javascript code.

Snippet

<!DOCTYPE html>
<html>
 
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 <meta content="width=device-width,initial-scale=1,maximum-scale=5,user-scalable=yes" name="viewport">
 
 <title></title>
 
 <script src="https://www.wikitude.com/libs/architect.js"></script>
 <script src="js/jquery-3.2.1.slim.min.js"></script>
 
 <link rel="stylesheet" href="css/default.css">
</head>
 
<body>
 <div id="message" class="info">zzZ</div>
 
 <script src="js/PointOfInterest.js"></script>
</body>
</html>

Snippet$("message").html("new text");

Snippetvar t = document.createTextNode("new text");
var message = document.getElementById("message");
message.replaceChild(message.firstChild, t);

Wikitude Technical Support

said almost 7 years ago

Hi,

the api for replaceChild is parentNode.replaceChild(newChild, oldChild);

In your snippet you have the parameters in the wrong order.

This should trigger an error which can be seen in the Android logcat or when remote debugging in the Google Chrome console.

Best Regards,

Alex

L

Lance Do

said almost 7 years ago

Thanks! It worked with DOM's native APIs.

However, jQuery doesn't work. Do you have any idea. Am I missing anything or Wikitude SDK don't support jQuery anymore?

Wikitude Technical Support

said almost 7 years ago

Hi,

in your snippet you call $("message").html("new text"); but you are referencing an id and you probably need to add a '#' before its name.

Please try $("#message").html("new text");

Best Regards,

Alex

L

Lance Do

said almost 7 years ago

It's worked like a charm :) Thank you!

How can we help you today?