<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" onload="init()">
<script>
function init()
{
var number = document.rootElement.createSVGNumber();
// Test initial value
if (number.value == 0) {
document.getElementById("test1").setAttribute("fill", "green");
}
// Assign new values from local function
number.value = 100;
if (number.value == 100) {
document.getElementById("test2").setAttribute("fill", "green");
}
// Assign new values from external function
assignValues(number);
if (number.value == 300) {
document.getElementById("test3").setAttribute("fill", "green");
}
// Create new number in external function, check values
var newNumber = createNewNumber();
if (newNumber.value == 66) {
document.getElementById("test4").setAttribute("fill", "green");
}
// Check swapping of number objects
var savedNumber = number;
number = newNumber;
if (number.value == 66) {
document.getElementById("test5").setAttribute("fill", "green");
}
number = savedNumber;
if (number.value == 300) {
document.getElementById("test6").setAttribute("fill", "green");
}
// Modifying savedNumber, should also modify number
savedNumber.value = 150;
if (number.value == 150) {
document.getElementById("test7").setAttribute("fill", "green");
}
}
function assignValues(n)
{
n.value = 300;
}
function createNewNumber()
{
var number = document.rootElement.createSVGNumber();
number.value = 66;
return number;
}
</script>
<rect id="test1" transform="translate(0, 0)" x="0" y="0" width="100" height="20" fill="red"/>
<rect id="test2" transform="translate(0, 30)" x="0" y="0" width="100" height="20" fill="red"/>
<rect id="test3" transform="translate(0, 60)" x="0" y="0" width="100" height="20" fill="red"/>
<rect id="test4" transform="translate(0, 90)" x="0" y="0" width="100" height="20" fill="red"/>
<rect id="test5" transform="translate(0, 120)" x="0" y="0" width="100" height="20" fill="red"/>
<rect id="test6" transform="translate(0, 150)" x="0" y="0" width="100" height="20" fill="red"/>
<rect id="test7" transform="translate(0, 180)" x="0" y="0" width="100" height="20" fill="red"/>
</svg>