نرگس چنگیزی
مطالب مرتبط با طراحی صفحات وب
N<html> or <body style="background-image:url(rat.jpg) ;font-size:20"> n<p style="color: red; margin-left: 50px"> اکنون که يک مفهومي از زبان جاوااسکريپت را در ذهن داريد، بايد ببينيم که با آن چکار مي توانيم انجام دهيم يا بهتر بگويم که جاوااسکريپت چه کاري براي ما انجام مي دهد و چه قابليتهايي را در مرورگر ايجاد مي کند. در حال حاضر شما ميدانيد که براي اجرا شدن کدهاي جاوااسکريپت بايد آنها را در ميان تگهاي اچ تي ام ال بکار بريد. شايد اين سؤال برايتان پيش بيايد که در کجا بايد آنها را بنويسيد، آيا جاي خاصي دارند يا در هر کجا مي توانيد اينکار را انجام دهيد. کدهاي جاوااسکريپت مي توانند در هر کجاي سورس کد باشند اما بايد ابتدا تشخيص دهيد که بکاربردن هر قسمت از اسکريپت در کجا مناسب تر مي باشد. بطور کل کدهاي جاوااسکريپت به سه دسته تقسيم ميشوند، دسته اول از آنها در قسمت سر يعني head جاي مي گيرند. دسته دوم در قسمت بدنه کدهاي اچ تي ام ال نوشته می شوند. دسته سوم هم در يک فايل جداگانه و خارج از کدهاي html با پسوند js قرار مي گيرند.
<body style="font-size:20 ">n
HyperText Markup Language (HTML) is the predominant markup language for web
pages. HTML elements are the basic building-blocks of webpages.
</p>
<p style="color: lightgreen; margin-right: 20px">
HTML is written in the form of HTML elements consisting of tags, enclosed in angle
brackets (like <html>), within the web page content. HTML tags most commonly
come in pairs like <h1> and </h1>, although some tags, known as empty elements,
are unpaired, for example. The first tag in a pair is the start tag, the second tag is the
end tag (they are also called opening tags and closing tags). In between these tags
web designers can add text, tags, comments and other types of text-based
content.The purpose of a web browser is to read HTML documents and compose
them into visible or audible web pages. The browser does not display the HTML
tags, but uses the tags to interpret the content of the page.
</p>
<p style="position:fixed;top:150;left:400; color:blue">
This is example
</p>
<p style="border-color:pink; border-style:outset;border-width:15">
HTML elements form the building blocks of all websites. HTML allows images and
objects to be embedded and can be used to create interactive forms. It provides a
means to create structured documents by denoting structural semantics for text such
as headings, paragraphs, lists, links, quotes and other items. It can embed scripts in
languages such as JavaScript which affect the behavior of HTML webpages.
</p>
<p style="border-color:purple; border-style:inset;border-width:15;padding:15;">
The first publicly available description of HTML was a document called "HTML
Tags", first mentioned on the Internet by Berners-Lee in late 1991.[5][6] It describes
20 elements comprising the initial, relatively simple design of HTML. Except for the
hyperlink tag, these were strongly influenced by SGMLguid, an in-house SGML
based documentation format at CERN. Thirteen of these elements still exist in HTML
4
</p>
<p style="border-color:lightskyblue; border-style:inset;border-
width:25;wigth:100;hieght:100;overflow:scroll">
Hypertext markup language is a markup language that web browsers use to interpret
and compose text, images and other material into visual or audible web pages. Default
characteristics for every item of HTML markup are defined in the browser, and these
characteristics can be altered or enhanced by the web page designer's additional use
of CSS. Many of the text elements are found in the 1988 ISO technical report TR
9537 Techniques for using SGML, which in turn covers the features of early text
formatting languages such as that used by the RUNOFF command developed in the
early 1960s for the CTSS (Compatible Time-Sharing System) operating system: these
formatting commands were derived from the commands used by typesetters to
manually format documents. However, the SGML concept of generalized markup is
based on elements (nested annotated ranges with attributes) rather than merely print
effects, with also the separation of structure and processing; HTML has been
progressively moved in this direction with CSS.
</p>
</body>
</html>N
در حقيقت جاوااسکريپت يک ابزار براي طراحان وب و نويسندگان کدهاي HTML مي باشد. جاوااسکريپت داراي ترکيباتي ساده نسبت به زبانهاي برنامه نويسي است که براحتي مي توان آنها را داخل کدهاي اچ تي ام ال يک صفحه قرار داد و از آنها استفاده کرد. يکي از قابليتهاي ويژه جاوااسکريپت رايگان بودن آن است که اگر شما زبان HTML را بدانيد، مي توانيد با کمي دانستن جاوااسکريپت کدهاي آماده که بيش از 2000 نوع از آنها در وب وجود دارد را در صفحات خود بکار گيريد.
با استفاده از اين زبان مي توانيد متنهاي پويا و متحرک در صفحات و در نقاط مختلف مرورگرها مانند نوار وضعيت آنها خلق کنيد. يکي ديگر از قابليتهاي اين زبان عکس العمل نشان دادن به وقايع و اتفاقات مي باشد بطور مثال واکنش نسبت به کليک يکي از دکمه هاي موس يا فشردن يک کليد بر روي کيبورد و يا انجام عملي هنگام بسته شدن صفحه مرورگر.
جاوااسکريپت حتي مي تواند کدهاي اچ تي ام ال را بخواند و يا توليد کند که توسط اين خاصيت مي توانيد در هر زمان خاص يک متني را توليد يا تغيير دهيد و يا در زماني مشخص عکسي را جايگزين عکسي ديگر کنيد.
يکي از بهترين ويژگيهاي جاوااسکريپت، اعتبار بخشيدن به اطلاعات مي باشد مثلاً شما يک فرمي براي ارتباط با کاربر خود ساخته ايد و مي خواهيد قبل از اينکه آن اطلاعات به سرور فرستاده شود، بازبيني شده تا اگر مشکلي وجود داشته باشد به کاربر اطلاع داده شود تا در صدد رفع آن برآيد. چون جاوااسکريپت اصطلاحاً Client side است، يعني در سيستم کاربر اجرا شده و مستقل از وب سرور است مي تواند ترافيک روي سرور را کم کرده که اين موضوع يک امتياز مثبت براي ميزبانان وب محسوب مي شود.
0 | 0
امتياز: 0 | نظر شما: 1 2 3 4 5
برچسب ها: جاوااسکريپت,ابزار ,وب,کد, HTML,Client side ,Client side ,قابليت,
نوشتن اسکريپت در قسمت head
کليه کدهاي جاوااسکريپت به محض باز شدن يک صفحه وب در مرورگر اجرا مي شوند اما گاهي اوقات ما نياز داريم تا يک اسکريپت زودتر از کدهاي ديگر اجرا شده و يا آماده باشد تا در صورت لزوم فراخواني شود. که اينگونه کدها را بايد در قسمت سر و ما بين تگ head بنويسيم. بطور مثال شما نياز به اين داريد که به محض ورود کاربر به صفحه در همان ابتدا پيغامي ظاهر شود و تا کاربر آنرا تأييد نکرده است صفحه تکميل نشود. اسکريپتهاي قسمت سر هميشه آماده اجرا و يا آماده پاسخ به اتفاقي در صفحه وب هستند، که در اين مورد شما مطمئن هستيد اسکريپت مورد نظر قبل از هر چيزي در صفحه، اجرا خواهد شد. براي نوشتن کدهاي جاوااسکريپت بصورت زير عمل مي کنيد:
<html>
<head>
<title> ... </title>
<script language="javascript" type="text/javascript">
...... javascript codes ......
<script/>
<head/>
نوشتن اسکريپت در قسمت بدنه
هنگاميکه نياز داشته باشيد تا کدهاي جاوااسکريپت در بدنه فايل html اجرا شود آنها را در قسمت body صفحه وارد مي کنيد،
<html>
<head>
<head/>
<body>
<script language="javascript" type="text/javascript">
....... javascript codes ......
<script/>
<body/>
<html/>
شما حتي مي توانيد توسط کدهاي جاوااسکريپت قسمتي از يک صفحه را بسازيد يعني با ترکيب جاوااسکريپت و تگهاي اچ تي ام ال در body يک عنصر در صفحه وارد کنيد. کدهاي زير را بنويسيد و اجرا کنيد:
<html>
<head>
</head>
<body>
<script language="javascript" type="text/javascript">
document.write("<h1 align='center'> Hello my friends! </h1>");n
</script>
</body>
</html>
اجراي کد
لازم بذکر است که شما مي توانيد براي نظم دادن و جلوگيري از شلوغي قسمت بدنه يک اسکريپت بصورت function در قسمت head تعريف کنيد و در قسمت بدنه آنرا فراخواني کنيد .
فايل خارجي جاوااسکريپت
شما مي توانيد براي حفظ نظم تگهاي اچ تي ام ال در يک صفحه وب و يا براي جلوگيري از تکرار يک اسکريپت در صفحات يک وب سايت، کدهاي جاوااسکريپت را در يک فايل جداگانه نوشته و با پسوند js آنها را ذخيره کنيد سپس در هر قسمت و هر صفحه اي که لازم بود، وارد کنيد. خط زير را در برنامه Notepad نوشته و آنرا به اسم test.js ذخيره کنيد:
document.write(" JavaScript external file ")n
حالا يک فايل اچ تي ام ال بسازيد و تگهاي زير را در آن وارد کنيد سپس با يک اسم دلخواه آنرا در همان پوشه که فايل جاوااسکريپت را ذخيره کرده ايد قرار دهيد:
<html>
<head>
</head>
<body>
<script language="javascript" type="text/javascript" src="test.js">
<script/>
<body/>
<html/>
اگر مراحل را بدرستي انجام داده باشيد، جمله زير را در مرورگرتان مشاهده خواهيد کرد.
JavaScript external file
دقت کنيد که اگر فايل جاوااسکريپت را در پوشه اي جدا از فايل html قرار مي دهيد حتماً در خصوصيت src آدرس دقيق آنرا بنويسيد.
1 | 0
امتياز: 0 | نظر شما: 1 2 3 4 5
برچسب ها: کد,جاوااسکريپت ,head,بدنه,javascript,codes,document,write, JavaScript, external, file,
