I have a body onload function in my XHTML and Javascript pages. For some reason the onload function won’t run and I don’t know why?
Here is my XHTML code:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>SVG_Bezier_Curve</title>
<link rel="stylesheet" type="text/css" href="http://localhost:8080/exist/rest/db/apps/HTML_Student/SVG_Bezier_Curve.css"/>
<script language="javascript" src="http://localhost:8080/exist/rest/db/apps/HTML_Student/SVG_Bezier_Curve_2.js">
</script>
</head>
<body onload = "Setup()">
<input type="button" id = "My_Button" value = "Click Me!" onclick="Setup2()"/>
<svg xmlns="http://www.w3.org/2000/svg" id="My_SVG" height="500" width="500">
<path id="Bezier_Curve_1"/>
<path id="Bezier_Curve_2" d="M 300, 200 A 50, 50 0,0,1 400,200" stroke="red" stroke-width="3" fill="none"/>
</svg>
</body>
</html>
And here is my Javascript code:
function Setup() {
var Bezier_Curve_Identification;
var Attribute_Name;
var Attribute_Name_2;
var Coordinate;
var My_Properties;
var Button_Identification;
Attribute_Name = "d";
Attribute_Name_2 = "style";
My_Properties = "stroke: blue; stroke-width: 3; fill: none;";
Coordinate = "M 375 200 A 50 50 0 0 1 475 200";
Button_Identification = document.getElementById('Bezier_Curve_Button');
Button_Identification.setAttribute = ("style", "top: 100px; height: 200px;");
Bezier_Curve_Identification = document.getElementById('Bezier_Curve_1');
Bezier_Curve_Identification.setAttribute(Attribute_Name, Coordinate);
Bezier_Curve_Identification.setAttribute(Attribute_Name_2, My_Properties);}
I corrected the brace in this code, but then I got an error message in my developer tools:
TypeError: Cannot set properties of null (setting ‘setAttribute’)
at Setup (SVG_Bezier_Curve_2.js:16:40)
at onload (SVG_Bezier_Curve.xhtml:8:27)