If you want to get the single element from a document in a Windows Store App developed using WinJS library , the developers can utilize the WinJS.Utilities.id method.
How to Get an Single Element from a document in WinJS Library ?
Below is a sample code snippet demonstrating how to retrieve the element from the current document using the WinJS.Utilities.id() method.
<script type="text/javascript">
WinJS.Utilities.id("Message").setStyle("color", "Yellow");
</script>
The above statement identifies the element “Message” and sets its foreground color to Yellow .
Note that we can also use the WinJS.Utilities.query method to perform the same operation as above. Below is the code snippet demonstrating the usage of Query method.
<script type="text/javascript">
WinJS.Utilities.query("Message").setStyle("color", "Yellow");
</script>
Here’s the complete HTML page that is used in this sample.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>WinJSApp</title>
<!-- WinJS references -->
<link href="//Microsoft.WinJS.2.0/css/ui-dark.css" rel="stylesheet" />
<script src="//Microsoft.WinJS.2.0/js/base.js"></script>
<script src="//Microsoft.WinJS.2.0/js/ui.js"></script>
<script src="Scripts/jquery-2.1.1.js"></script>
<!-- WinJSApp references -->
<link href="/css/default.css" rel="stylesheet" />
<script src="/js/default.js"></script>
<style type="text/css">
#Message {
display:none;
}
</style>
</head>
<body>
<div id="Message">
This is a Welcome Message
</div>
<button id="btnDisplay">
Click Me
</button>
<script type="text/javascript">
WinJS.Utilities.id("Message").setStyle("color", "Yellow");
</script>
</body>
</html>
