{"id":10881,"date":"2014-12-03T05:09:55","date_gmt":"2014-12-02T18:09:55","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/wordpress\/?p=10881"},"modified":"2018-10-28T07:42:54","modified_gmt":"2018-10-27T21:42:54","slug":"javascript-putelementsby-via-php-local-files-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/javascript-putelementsby-via-php-local-files-tutorial\/","title":{"rendered":"Javascript putElement(s)By via PHP Local Files Tutorial"},"content":{"rendered":"<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/putElementsBy.php?url=http:\/\/www.rjmprogramming.com.au\/wordpress\"><img decoding=\"async\" style=\"float:left;border: 15px solid pink;\" alt=\"Javascript putElement(s)By via PHP Local Files Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/putElementsBy_LocalFile.jpg\" title=\"Javascript putElement(s)By via PHP Local File Tutorial\" id='xdghfsdw' \/><\/a><p class=\"wp-caption-text\">Javascript putElement(s)By via PHP Local Files Tutorial<\/p><\/div>\n<p>Today we march on with the the Javascript <a target=_blank title='(Javascript) DOM information from Wikiedia ... thanks' href='http:\/\/en.wikipedia.org\/wiki\/Document_Object_Model'>DOM<\/a> journey as explained for the last few days with <a target=_blank href='#jpvpfut' title='Javascript putElement(s)By via PHP Follow Up Tutorial'>Javascript putElement(s)By via PHP Follow Up Tutorial<\/a> as shown below, as to whether we can come up with some useful &#8220;meaningful&#8221; functionality for &#8230;<\/p>\n<ul>\n<li>putElementById()<\/li>\n<li>putElementsByClassName()<\/li>\n<li>putElementsByTagName()<\/li>\n<\/ul>\n<p>&#8230; in Javascript &#8230; and though, today, we&#8217;ve improved, it still needs more work, such as catering for relative URLs, Ajax mode, perhaps, and the way it will not work with all URL data input.<\/p>\n<p>You may remember, yesterday, the introduction of the PHP <a target=_blank title='DOMDocument class information' href='http:\/\/php.net\/manual\/en\/class.domdocument.php'>DOMDocument<\/a> class functionality, where this <a target=_blank title='Useful DomDocument' href='http:\/\/www.binarytides.com\/php-tutorial-parsing-html-with-domdocument\/'>link<\/a> was very useful.   It allows PHP to simulate some of Javascript&#8217;s DOM capabilities, and in our case it is used to parse HTML from within PHP.  It also makes it easy to accept XML input data, as this happens here today.<\/p>\n<p>Here, today, we also add functionality for the use of local hard disk file browsing.<\/p>\n<p><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/putElementsBy_LocalFile.jpg\" title=\"Click picture\">Today<\/a> you can see that extra local file browsing and XML input functionality as a <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/PHP\/putElementsBy.php' title='putElementsBy.php'>live run<\/a>.<\/p>\n<p>And we worked out the <a target=_blank href='http:\/\/www.w3schools.com\/jsref\/met_win_open.asp' title='window.open information from w3schools'>window.open<\/a> approach doesn&#8217;t work everywhere, so we may end up falling back, a bit, on the underlying PHP, sometimes.<\/p>\n<p>Today&#8217;s downloadable PHP is <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/PHP\/putElementsBy.php--GETME' title='putElementsBy.php'>putElementsBy.php<\/a><\/p>\n<p>Progression on the code &#8230; <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/putElementsBy.php--GETME' title='putElementsBy.php'>putElementsBy.php<\/a><\/p>\n<hr \/>\n<p id='jpvpfut'>Previous relevant <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/wordpress\/?p=10870' title='Javascript putElement(s)By via PHP Follow Up Tutorial'>Javascript putElement(s)By via PHP Follow Up Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/putElementsBy.php?url=http:\/\/www.google.com\"><img decoding=\"async\" style=\"float:left;border: 15px solid pink;\" alt=\"Javascript putElement(s)By via PHP Follow Up Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/putElementsBy_FollowUp.jpg\" title=\"Javascript putElement(s)By via PHP Follow Up Tutorial\" id='dghfsdw' \/><\/a><p class=\"wp-caption-text\">Javascript putElement(s)By via PHP Follow Up Tutorial<\/p><\/div>\n<p>Today we continue the Javascript <a target=_blank title='(Javascript) DOM information from Wikiedia ... thanks' href='http:\/\/en.wikipedia.org\/wiki\/Document_Object_Model'>DOM<\/a> journey as explained yesterday with <a target=_blank href='#jpvppt' title='Javascript putElement(s)By via PHP Primer Tutorial'>Javascript putElement(s)By via PHP Primer Tutorial<\/a> as shown below, as to whether we can come up with some useful &#8220;meaningful&#8221; functionality for &#8230;<\/p>\n<ul>\n<li>putElementById()<\/li>\n<li>putElementsByClassName()<\/li>\n<li>putElementsByTagName()<\/li>\n<\/ul>\n<p>&#8230; in Javascript &#8230; and though, today, we&#8217;ve improved, it still needs more work, such as catering for relative URLs, Ajax mode, perhaps, and the way it will not work with all URL data input.<\/p>\n<p>Today, to improve the program, we can, at times use the PHP <a target=_blank title='DOMDocument class information' href='http:\/\/php.net\/manual\/en\/class.domdocument.php'>DOMDocument<\/a> class functionality, and this <a target=_blank title='Useful DomDocument' href='http:\/\/www.binarytides.com\/php-tutorial-parsing-html-with-domdocument\/'>link<\/a> was very useful.   It allows PHP to simulate some of Javascript&#8217;s DOM capabilities, and in our case it is used to parse HTML from within PHP.<\/p>\n<p><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/putElementsBy_FollowUp.jpg\" title=\"Click picture\">Today<\/a> we make it more user-friendly with a text input button to accept a user-defined URL to use as the data base (small blank chortle).<\/p>\n<p>And we worked out the <a target=_blank href='http:\/\/www.w3schools.com\/jsref\/met_win_open.asp' title='window.open information from w3schools'>window.open<\/a> approach doesn&#8217;t work everywhere, so we may end up falling back, a bit, on the underlying PHP, sometimes.<\/p>\n<p>Today&#8217;s downloadable PHP is <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/PHP\/putElementsBy.php-GETME' title='putElementsBy.php'>putElementsBy.php<\/a><\/p>\n<p>Progression on the code &#8230; <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/PHP\/putElementsBy.php-GETME' title='putElementsBy.php'>putElementsBy.php<\/a><\/p>\n<hr \/>\n<p id='jpvppt'>Previous relevant <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/wordpress\/?p=10855' title='Javascript putElement(s)By via PHP Primer Tutorial'>Javascript putElement(s)By via PHP Primer Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/putElementsBy.php?url=http:\/\/www.rjmprogramming.com.au\/PHP\/audio_video.php\"><img decoding=\"async\" style=\"float:left;border: 15px solid pink;\" alt=\"Javascript putElement(s)By via PHP Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/PHP\/putElementsBy.jpg\" title=\"Javascript putElement(s)By via PHP Primer Tutorial\" id='ghfsdw' onmouseover='  this.src=this.src.replace(\".gif\",\".JPG\").replace(\".jpg\",\".png\").replace(\".png\",\".gif\").replace(\".JPG\",\".jpg\");       '  \/><\/a><p class=\"wp-caption-text\">Javascript putElement(s)By via PHP Primer Tutorial<\/p><\/div>\n<p>If you are into Javascript <a target=_blank title='(Javascript) DOM information from Wikiedia ... thanks' href='http:\/\/en.wikipedia.org\/wiki\/Document_Object_Model'>DOM<\/a> you will be into &#8230;<\/p>\n<ul>\n<li><a target=_blank title='Javascript getElementById() method information from w3schools' href='http:\/\/www.w3schools.com\/jsref\/met_document_getelementbyid.asp'>getElementById()<\/li>\n<li><a target=_blank title='Javascript getElementsByClassName() method information from w3schools' href='http:\/\/www.w3schools.com\/jsref\/met_document_getelementsbyclassname.asp'>getElementsByClassName()<\/a><\/li>\n<li><a target=_blank title='Javascript getElementsByTagName() method information from w3schools' href='http:\/\/www.w3schools.com\/jsref\/met_document_getelementsbytagname.asp'>getElementsByTagName()<\/a><\/li>\n<\/ul>\n<p>&#8230; and being into programming, for every <i>get<\/i> you ever see in a function or method name, you may be accustomed to looking for the <i>set<\/i> or <i>put<\/i> reverse functionality function or method.<\/p>\n<p>Gadzooks &#8230; there is no &#8230;<\/p>\n<ul>\n<li>putElementById()<\/li>\n<li>putElementsByClassName()<\/li>\n<li>putElementsByTagName()<\/li>\n<\/ul>\n<p>&#8230; and no <i>set<\/i> versions either, in Javascript &#8230; but today we imagine a set of Javascript functions (minus the document. bizzo though &#8230; a poet who doesn&#8217;t know it&#8230; chortle, chortle) &#8230; how could they work? &#8230; well, you could try packing them off with a couple of vegemite sandwiches and an orange off up the road to get the bus &#8230; or, well, maybe a transfer of HTML element&#8217;age (elementary &#8230; no end to the chortles today!) to the end of our own webpage (optionally from another URL, perhaps &#8230; (we&#8217;ll need PHP) &#8230; haven&#8217;t dealt with relative URLs yet, though).<\/p>\n<p>So, try it if you like &#8230;<\/p>\n<ul>\n<li><a target=_blank href='http:\/\/www.rjmprogramming.com.au\/PHP\/putElementsBy.php' title='Use this as the URL'>Live run with this page as the URL<\/a><\/li>\n<li><a target=_blank href='http:\/\/www.rjmprogramming.com.au\/PHP\/putElementsBy.php?url=http:\/\/www.rjmprogramming.com.au\/PHP\/audio_video.php' title='Use audio_video.php as the URL'>Live run with another page as the URL<\/a><\/li>\n<\/ul>\n<p>Today&#8217;s downloadable PHP is <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/PHP\/putElementsBy.php_GETME' title='putElementsBy.php'>putElementsBy.php<\/a> (whose code would improve with the relative URL issue disappearing &#8230; and if this disappears you know we got to that first!)<\/p>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#10855' onclick='var dv=document.getElementById(\"d10855\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"http:\/\/www.rjmprogramming.com.au\/wordpress\/?tag=DOM\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d10855' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr \/>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#10870' onclick='var dv=document.getElementById(\"d10870\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"http:\/\/www.rjmprogramming.com.au\/wordpress\/?tag=Javascript\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d10870' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr \/>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#10881' onclick='var dv=document.getElementById(\"d10881\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"http:\/\/www.rjmprogramming.com.au\/wordpress\/?tag=XML\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d10881' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Today we march on with the the Javascript DOM journey as explained for the last few days with Javascript putElement(s)By via PHP Follow Up Tutorial as shown below, as to whether we can come up with some useful &#8220;meaningful&#8221; functionality &hellip; <a href=\"https:\/\/www.rjmprogramming.com.au\/ITblog\/javascript-putelementsby-via-php-local-files-tutorial\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[12,37],"tags":[421,576,652,932,997,1319,1480],"class_list":["post-10881","post","type-post","status-publish","format-standard","hentry","category-elearning","category-tutorials","tag-file-browsing","tag-html","tag-javascript","tag-php","tag-programming","tag-tutorial","tag-xml"],"_links":{"self":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/10881"}],"collection":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/comments?post=10881"}],"version-history":[{"count":1,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/10881\/revisions"}],"predecessor-version":[{"id":41541,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/10881\/revisions\/41541"}],"wp:attachment":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/media?parent=10881"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/categories?post=10881"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/tags?post=10881"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}