انجمن سایت کلیدستان



مشکل با DOM JS (برنامه نویسی javascript)زمان کنونی: ۱۳۹۵/۰۹/۲۱، ۱۲:۲۷ ب.ظ
کاربران در حال بازدید این موضوع: 1 مهمان
نویسنده: sadeq460
آخرین ارسال: sadeq460
پاسخ 3
بازدید 331

رتبه موضوع:
  • 0 رای - 0 میانگین
  • 1
  • 2
  • 3
  • 4
  • 5
مشکل با DOM JS (برنامه نویسی javascript)

مشکل با DOM JS (برنامه نویسی javascript)

#1
سلام من میخام یه ویرایشگر متن برای برنامه ام درست کنم با اسنفاده از تگ های html ولی این کد جاوا اسکربپت که قراره تگ ها رو به اخر فایل html ام append کنه کار نمی کنه لطفا ببنید مشکل اش چیه

کد پی‌اچ‌پی:
<html>
<
head>
 <
meta http-equiv="content-type" content="text/html; charset=utf-8" />
 <
script language="JavaScript" >
    var 
mainDiv document.getElementById('mainDiv');
    function 
appendTag(action,tagName,id,text,align){
        if(
action=="createElement"){
            switch(
tagName){
                case 
"b":
                    var 
newTag document.createElement(tagName);
                    
newTag.setAttribute('id',id);
                    
newTag.innerHTML "";
                    
mainDiv.appendChild(newTag);
                break;
                case 
"i":
                    var 
newTag document.createElement(tagName);
                    
newTag.setAttribute('id',id);
                    
newTag.innerHTML "";
                    
mainDiv.appendChild(newTag);
                break;
                 case 
"u":
                    var 
newTag document.createElement(tagName);
                    
newTag.setAttribute('id',id);
                    
newTag.innerHTML "";
                    
mainDiv.appendChild(newTag);
                break;
                case 
"p":
                    if(
align == "center"){
                        var 
newTag document.createElement(tagName);
                        
newTag.setAttribute('id',id);
                        
newTag.setAttribute("align","center");
                        
newTag.innerHTML "";
                        
mainDiv.appendChild(newTag);
                    }
                    if(
align == "left"){
                        var 
newTag document.createElement(tagName);
                        
newTag.setAttribute('id',id);
                        
newTag.setAttribute("align","left");
                        
newTag.innerHTML "";
                        
mainDiv.appendChild(newTag);
                    }
                    if(
align == "right"){
                        var 
newTag document.createElement(tagName);
                        
newTag.setAttribute('id',id);
                        
newTag.setAttribute("align","right");
                        
newTag.innerHTML "";
                        
mainDiv.appendChild(newTag);
                    }
                    if(
align == "justify"){
                        var 
newTag document.createElement(tagName);
                        
newTag.setAttribute('id',id);
                        
newTag.setAttribute("align","justify");
                        
newTag.innerHTML "";
                        
mainDiv.appendChild(newTag);
                    }
                break;
                case 
"h1":
                    var 
newTag document.createElement(tagName);
                    
newTag.setAttribute('id',id);
                    
newTag.innerHTML "";
                    
mainDiv.appendChild(newTag);
                break;
                case 
"h2":
                    var 
newTag document.createElement(tagName);
                    
newTag.setAttribute('id',id);
                    
newTag.innerHTML "";
                    
mainDiv.appendChild(newTag);
                break;
                case 
"h3":
                    var 
newTag document.createElement(tagName);
                    
newTag.setAttribute('id',id);
                    
newTag.innerHTML "";
                    
mainDiv.appendChild(newTag);
                break;
                case 
"h4":
                    var 
newTag document.createElement(tagName);
                    
newTag.setAttribute('id',id);
                    
newTag.innerHTML "";
                    
mainDiv.appendChild(newTag);
                break;
                case 
"h5":
                    var 
newTag document.createElement(tagName);
                    
newTag.setAttribute('id',id);
                    
newTag.innerHTML "";
                    
mainDiv.appendChild(newTag);
                break;
                case 
"h6":
                    var 
newTag document.createElement(tagName);
                    
newTag.setAttribute('id',id);
                    
newTag.innerHTML "";
                    
mainDiv.appendChild(newTag);
                break;
            }
        }
        if(
action=="innerHTML"){
            
id.innerHTML=id.innerHTML+text
            
//document.getElementById(id).innerHTML=document.getElementById(id).innerHTML+ text;
        
}
    }
 
</script>
</head>
<body >
 <div id="mainDiv">
     <input type="button" onclick="appendTag('createElement','b','d1','','');" value="add tag"/>
     <input type="button" onclick="appendTag('innerHTML','','d1','yes','');" value="make text"/>

 </div>
</body>
</html> 
پاسخ

مشکل با DOM JS (برنامه نویسی javascript)

#2
سلام.
بنده فرصت نمی کنم کدها را بررسی کنم، اما خیلی مواقع که ما یک سری کد javascript داریم و آنها را در صفحه اجرا می کنیم و نتیجه مورد نظرمان حاصل نمی شود، به این دلیل است که در آن کدها از روش های موجود در کتابخانه jquery استفاده شده است. بنابراین تا زمانی که ارجاع به فایل کتابخانه jquery را در کدهای HTML صفحه ذکر نکنیم، کدهای javascript به درستی اجرا نمی شوند.
بنابراین بد نیست که این مورد را بررسی نمایید.
در مورد jquery (و چگونگی ارجاع به آن)، دسته کلید (دسته بندی) زیر را مشاهده کنید :

دسته کلید (دسته بندی) شماره 290

bookbook 
لطفا برای درج کد، از دکمه مخصوص درج کد در ادیتور انجمن استفاده کنید.
در مورد برنامه نویسی، مدیران تنها راهنمایی می کنند و نوشتن برنامه نهایی، به عهده کاربران می باشد (اینجا محلی برای یادگیری است، نه سفارش کدنویسی).
کاربران باید ابتدا خود به خطایابی برنامه بپردازند، نه اینکه به محض دیدن خطا، کدها را در انجمن، copy و paste کرده و از مدیران انتظار بررسی داشته باشند.
پاسخ

مشکل با DOM JS (برنامه نویسی javascript)

#3
مشکل ام حل شد کد برای بقیه
کد پی‌اچ‌پی:
<html>
<
head>
 <
meta http-equiv="content-type" content="text/html; charset=utf-8" />
 <
script type="text/javascript">                       
          
     function 
make(elemcontent) {
        var 
enode document.createElement(elem);          // li, p, div        
        
var tnode document.createTextNode(content);      // content of the node
        
enode.appendChild(tnode);                          // write content in element
      
        
return enode;          
     }
     
     function 
bake(insertNodeelemcontentattributes) {
         var 
newElem make(elemcontent);
         
         if (
attributes !== false && typeof attributes !== 'undefined') {
             for (
prop in attributes) {
                 
                 
// prevent double IDs
                 
if (prop === 'id' && document.getElementById(attributes[prop]) !== null)
                     continue;
                     
                  
newElem.setAttribute(prop,attributes[prop]);
             }
         }
         
document.getElementById(insertNode).appendChild(newElem);         
     }
     
     function 
change(idcontent) {
         
document.getElementById(id).textContent content;
     }
     
     function 
changeHTML(idcontent) {
         
document.getElementById(id).innerHTML content;
     }
 
</script>
</head>
<body >
 
    <input type="button" onclick="bake('content', 'p', 'Hai im an paragraph!')" value="make p"/>
    <input type="button" onclick="bake('content', 'div', 'Hai! im an div')" value="make div"/>
    <input type="button" onclick="bake('content', 'p', 'Hai! im an right algined paragraph!', {align: 'right'})" value="make p right"/>
    <input type="button" onclick="bake('content', 'p', 'Im a node with an ID', {id: 'myID'})" value="make #myID"/>
    <input type="button" onclick="change('myID', 'Uh... i changed')" value="Change #myID"/>
    <input type="button" onclick="changeHTML('myID', '<ul><li>Be aware that this list isnt touchable with JavaScript</li><li>when you do it that way</li></ul>')" value="ChangeHTML #myID"/>
    
 <div id="content">
 </div>
    
</body>
</html> 
 
پاسخ
 سپاس شده توسط admin


پرش به انجمن:


کاربران در حال بازدید این موضوع: 1 مهمان

آخرین کلیدهای غیررایگان

شما هم می توانید کلیدهای غیررایگان منتشر کنید (بیشتر بدانید)